Dropdown im IE 6

[Nad Flanders]

Hallo,

wie oben schon beschrieben habe ich nen kleines Problem im IE 6 mit Dropdowns Menues. Im IE 7 funktioniert es, im FF sowieso.
Hier mal der Code:

  
<div class="aussen">  
<span class="menuetag">...</span>  
<a  href="..."></a>  
<a href=" "></a>  
<a href=" "></a>  
<a href=" "></a>  
<a href=" "></a>  
<a href=""></a>  
</div>  
  

und das dazugehörige css

  
#menue .aussen {  
 float: left;  
 display: block;  
 overflow: hidden;  
 height: 1.3em;  
 text-align: center;  
 color: #ffb62d;  
 margin-left:20px;  
 font-size: 14pt;  
 text-decoration: none;  
 font-family: Verdana, Arial, sans-serif;  
 margin-top:auto;  
 margin-bottom:auto;  
}  
#menue .aussen:hover {  
 height: auto;  
 background: url(../Pics/flyout_002479.png);  
 border: 1px solid #002479;  
}  
#menue a{  
 display: block;  
 text-decoration: none;  
 font-size: 10pt;  
 text-align: center;  
 padding: 10px;  
 text-align: left;  
 color: white;  
 border-top: 1px solid orange;  
 letter-spacing: 1pt;  
 }  
#menue a:hover {  
 background: url(../Pics/flyout_002479_hover.png);  
 color: orange;  
 border-color: white;  
  }  
span.menuetag {  
 display: block;  
 cursor: default;  
padding-bottom: 4px;  
text-align: left;  
padding-left:10px;  
padding-right: 10px;  
 }  
  
#wrapper{  
 width:82%;  
 float: left;  
 height:inherit;  
 clear: right;  
 text-align:justify;  
 font-size:80%;  
   }  
#shadow{  
 height:10px;  
 background: url(../Pics/shadow.png);  
 background-position: top right;  
 margin-right:178px;  
 background-repeat: repeat-x;  
 }  
  

...ich weiss, ich muss noch Einiges zusammenfassen im Css....Wenn irgendwer nen Tip für mich hat, wäre ich dankbar.

Lg
Nad

[suit]

...ich weiss, ich muss noch Einiges zusammenfassen im Css....Wenn irgendwer nen Tip für mich hat, wäre ich dankbar.

ein wertvoller tipp ist sicher: nutze die macht von listen

[ChrisB]

Hi,

wie oben schon beschrieben habe ich nen kleines Problem im IE 6 mit Dropdowns Menues.

<div class="aussen">
#menue .aussen {

Dass der IE 6 :hover ausschliesslich auf Links mit href-Attribut unterstuetzt, sollte doch wohl bekannt sein.

http://de.selfhtml.org/css/layouts/navigationsleisten.htm#modern

MfG ChrisB

[Nad Flanders]

Hi Chris,

Dass der IE 6 :hover ausschliesslich auf Links mit href-Attribut unterstuetzt, sollte doch wohl bekannt sein.

http://de.selfhtml.org/css/layouts/navigationsleisten.htm#modern

mit dem css aus dem link habe ich genau das gleiche Problem im IE6.
Von der Geschichte mit dem JS halte ich gar Nichts. Wass ist wenn ein Nutzer der den IE nutzt kein JS aktiviert hat?

@suit

jetzt habe ich auf jeden Fall erstmal nen ganze Menge zu lesen. Wenn noch irgendwer eine Lösung ohne Js hat, die im IE funktioniert, wäre ich dankbar.

Lg;
Nad

[EKKi]

Mahlzeit Nad Flanders,

Dass der IE 6 :hover ausschliesslich auf Links mit href-Attribut unterstuetzt, sollte doch wohl bekannt sein.

http://de.selfhtml.org/css/layouts/navigationsleisten.htm#modern

mit dem css aus dem link habe ich genau das gleiche Problem im IE6.

Kein Wunder: beachten Sie "<http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active@title=Beachten Sie:>" ... aber darauf hatte ChrisB Dich ja bereits hingewiesen.

MfG,
EKKi

[Nad Flanders]

habe das glaube ich Etwas brauchbares gefunden:

http://www.cssplay.co.uk/menus/pro_drop8.html

LG

[ChrisB]

Hi,

Von der Geschichte mit dem JS halte ich gar Nichts. Wass ist wenn ein Nutzer der den IE nutzt kein JS aktiviert hat?

Dann servierst du ihm einen Fallback, der vielleicht optisch nicht so gelungen sein mag, aber zumindest die Nutzung des Menues ermoeglicht.
(Zum Beispiel alle Navigationsebenen aufgeklappt.)

MfG ChrisB

[johannes293]

Wenn noch irgendwer eine Lösung ohne Js hat, die im IE funktioniert, wäre ich dankbar.

Ja, Dropdown im IE 6 ohne JS geht:
http://www.cssplay.co.uk/menus/elegant1.html
Irgendwie verwendet der conditional comments, um das ganze fuer den IE in eine Tabelle zu verwandelt, auf der der IE<7 scheinbar hover anwendet.
Da stellt sich die Frage: Warum wendet der IE bei tabellen hover an, nicht aber bei ungeordneten Listen - gibts dafuer eine Erklaerung?
(weise darauf hin, dass der Autor die Nutzungsbedinungen fuer diesen Code einschraenkt, naehres auf der verlinkten Seite.)
Html:

<ul id="menu">  
 <li><a class="current" href="#url">Home</a></li>  
 <li><a href="#url">About Us<!--[if gte IE 7]><!--></a><!--<![endif]-->  
 <!--[if lte IE 6]><table><tr><td><![endif]-->  
  
  <ul>  
   <li><a href="#url">Who we are</a></li>  
   <li><a href="#url">What we do</a></li>  
   <li><a href="#url">Where to find us</a></li>  
  </ul>  
 <!--[if lte IE 6]></td></tr></table></a><![endif]-->  
 </li>  
  
</ul>

</div>[/code]
Css: (fuer die tables)
#menu table {border-collapse:collapse; height:0; width:0; margin:0 -4px -1px 0;}

Diese interessante Methode weiter zu erforschen steht seit langem auf meiner to-do-liste...
Auch wenn die Variante den Code verschandelt (aber valid ist), ist sie meiner Meinung nach besser als de-facto-Vorraussetzen von Javascript

g johannes

[ChrisB]

Hi,

Ja, Dropdown im IE 6 ohne JS geht:
http://www.cssplay.co.uk/menus/elegant1.html
Irgendwie verwendet der conditional comments, um das ganze fuer den IE in eine Tabelle zu verwandelt, auf der der IE<7 scheinbar hover anwendet.

Nein, es schachtelt ungueltiger Weise eine Tabelle in den Link hinein.
Und auf dem Link "kann" der IE 6 ja auch :hover.

Potentielle Nebenwirkungen dieses grob fehlerhaften Codes sind unabsehbar.

MfG ChrisB

[johannes293]

abend,

Nein, es schachtelt ungueltiger Weise eine Tabelle in den Link hinein.
Potentielle Nebenwirkungen dieses grob fehlerhaften Codes sind unabsehbar.

Ich denke, dass man einem grob fehlerhaftem Browser grob fehlerhaften Code geben kann -
Folgen sind nach Testen in verschiedenen IEs absehbar.
kurz: glaube nicht, dass diese Methode problematisch ist (lasse mich aber gerne einis besseren belehren ;) )

g johannes

[Kai345]

[latex]Mae  govannen![/latex]

Nein, es schachtelt ungueltiger Weise eine Tabelle in den Link hinein.
Potentielle Nebenwirkungen dieses grob fehlerhaften Codes sind unabsehbar.
Ich denke, dass man einem grob fehlerhaftem Browser grob fehlerhaften Code geben kann -
Folgen sind nach Testen in verschiedenen IEs absehbar.
kurz: glaube nicht, dass diese Methode problematisch ist (lasse mich aber gerne einis besseren belehren ;) )

Sehe ich prinzipiell ähnlich, IE6 ist so kaputt, daß er es nicht besser verdient hat ;) Jedenfalls würde normalerweise ein Problem mit dieser Methode schon bekannt geworden sein, mutmaße ich mal.

Allerdings würde ich persönlich nie [3] meinen schönen Quellcode mit solcherlei Zeug versauen (genausowenig, wie ich [3] verschachtelte divs für »runde Ecken« nutzen würde[4]). IE 5.5 und 6 bekommen für ein Hover-Menü etwas Javascript-Nachhilfe [1], wer das ausgeschaltet hat, hat eben Pech gehabt und bekommt kein Menü. [2]

Cü,

Kai

[1] Sofern sich dieser auch als IE 5 oder 6 zu erkennen gibt, ansonsten -> Pech gehabt -> siehe [2]

[2] Da ich jedoch die permanent sichtbaren Hauptmenüpunkte mit einem Link zu einer Übersicht-Seite versehe, kann man über diesen Umweg trotzdem an die Inhalte der Unterseiten gelangen

[3] freiwillig

[4] border-radius, -moz-border-radius, -webkit-border-radius und für Opera SVG, andere Browser haben halt »eckige« Ecken

[suit]

Potentielle Nebenwirkungen dieses grob fehlerhaften Codes sind unabsehbar.

sag das mal gunnar, dann gibts wieder streiterein :D