5k Aufrufe
Gefragt in Webseiten HTML von dunkelpink Einsteiger_in (75 Punkte)
Hallo,
ich habe mich schon ganz vergoogelt und immer noch keine für mich gute und verstehbare Lösung gefunden:

Ich habe eine css-gestylte Navigation mit Hovereffekt, der folgendes auslöst::
1. Schrift- und Hintergrundfarbwechsel
2. bei drei Menüpunkten erscheint ein Untermenü.

Beides funktioniert im IE 6 nicht, hat es aber mal, und zwar nur mit css, ohne Java. Ich weiß nicht, ob mir da etwas abhanden gekommen ist (ich hatte beim Erstellen der Seite Hilfe im Bezug auf die Browserkompatibilität, die steht jetzt aber nicht mehr zur Verfügung).

Hat jemand eine Idee?

1000 Dank schon mal fürs Angucken!

#nav {
background-color: #004097;
width: 180px;
height: 403px;
margin-top: 0px;
position: relative;
}

#nav ul {
list-style: none;
margin: 10px 0px 0px 0px;
padding-top: 5px;
text-align: center;
padding-left: 0px;
}

#nav ul li {
margin-bottom: 8px;
background-color: #4268ff;
height: 30px;
width: 180px;
line-height: 28px;
position: relative;
}

* html #nav ul {
margin-left:-16px;
ma\rgin-left:0;
}

#nav img#logo {
margin-top: 0px;
}

#nav img {
border: 0px;
}

#nav ul li a {
display: block;
width: 180px;
height: 30px;
font-size: 13px;
font-weight: bold;
color: #fff;
text-decoration: none;
}

#nav a:hover,#nav a #aktiverpunkt {
color: #fff;
background-color: #e2001a;
}

*html #nav a, *html #nav a:visited {
background:#4268ff;
width: 180px;
w\idth:179px;
}

#nav a:active {
}

#nav a:visited {
}

#nav ul ul {
visibility: hidden;
position: absolute;
top: -20px;
left: 180px;
padding: 0px;
}

#nav ul li:hover ul, #nav ul a:hover ul {
visibility: visible;
}

#nav ul li ul {
background-color: #004097;
padding: 10px 10px 0px 10px;
}

#nav ul li ul li a {
background-color: #e2001a;
color: #fff;
}

<div id="nav"><img src="Bilder/Logo_ohne_schrift.jpg" alt="Logo" width="180" height="115" />
<ul>
<li><a href="wirueberuns.html" class="sub">Wir &uuml;ber uns<!--[if IE 7]><!--></a><!--><![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->

<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#" class="sub">Frauenh&auml;user<!--[if IE 7]><!--></a><!--><![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="geschichte.html">Geschichte</a></li>
<li><a href="wasisteinfrauenhaus.html">Was ist ein Frauenhaus</a></li>
<li><a href="wegeinsfrauenhaus.html">Wege ins Frauenhaus</a></li>
<li><a href="leben.html">Leben im Frauenhaus</a></li>
<li><a href="migrantinnen.html">Migrantinnen</a></li>
<li><a href="maedchenjungen.html">M&auml;dchen und Jungen</a></li>
<li><a href="checkliste.html">Checkliste</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#" class="sub">Gewalt gegen Frauen<!--[if IE 7]><!--></a><!--><![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="gewaltbegriff.html">Was ist Gewalt</a></li>
<li><a href="gesetz.html">Gewaltschutzgesetz</span></a></li>
<li><a href="umgangsrecht.html">Umgangsrecht</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="#" class="sub">Wir bieten<!--[if IE 7]><!--></a><!--><![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="aktuelles.html">Aktuelles</a></li>
<li><a href="fortbildungen.html"><span style="font-size: 11px;">Fortbildungen Pr&auml;vention</span></a></li>
<li><a href="archiv.html">Archiv/Medien</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="links.html">Links</a></li>
<li><a href="kontakt.html">Kontakt / Impressum</a></li>
<li><a href="index.html">Home</a></li>
</ul>

</div>

15 Antworten

0 Punkte
Beantwortet von dunkelpink Einsteiger_in (75 Punkte)
Hi gast42,

danke für die Info. Wird ein bisschen dauern, bis ich das mit den Doctypes gerafft habe - werde mich mal hineinvertiefen.

Noch eine letzte Frage: hast du noch einen guten Link für die Hoverlösung - ich weiß gar nicht genau, was ich da einfügen muss:
"Diese fehlerhafte Stellen sind vermutlich der Code, den du extra einfügen musstest für den IE6"

dunkelpink
0 Punkte
Beantwortet von
das beste Tutorial gibts bei SelfHTML
0 Punkte
Beantwortet von dunkelpink Einsteiger_in (75 Punkte)
Danke, ich glaube das ist wirklich ein gutes Tutorial, ich weiß gar nicht warum mir das noch nicht aufgefallen ist.
0 Punkte
Beantwortet von deluxestyle Mitglied (901 Punkte)
also ich achte bei meinen Seiten gar nicht mehr auf den IE 6.
Die Benutzer bekommen die Hinweis, dass sie einen veralteten Browser verwenden und die Seite evtl nicht korrekt dargestellt wird.

Es gab auch einen Aufruf "Webmaster against IE 6"
0 Punkte
Beantwortet von
es sollte reichen, für Uralt-Browser das Stylesheet per @import einzubinden (dann kriegen die davon nix mit) und ansonsten gelegentlich zu schauen, ob die Browser, die mit @import etwas anfangen können, wenigstens ein passables Layout liefern.

Userbeschimpfungen wie in dem verlinkten heise.de-Artikel erachte ich als kontraproduktiv!
...