CSS Selektor/ Dreamweaver Spry Horizontal Menu
Simon
- css
2 Matthias Apsel0 Der Martin0 Matthias Apsel0 Simon0 Matthias Apsel0 Simon
0 ChrisB
Liebes Forum,
ich habe in Dreamweaver eine Spry-Menüleiste eingefügt und anschließend folgende Anleitung befolgt, um die Breite der Buttons variabel zu machen:
http://labs.adobe.com/technologies/spry/samples/menubar/AutoWidthHorizontalMenuBarSample.html
Ich hatte daraufhin aber folgende Probleme unter IE: das Sub-Menü hat sich nicht wie gewünscht vertikal nach unten ausgeklappt, sondern ist immer nach rechts ausgefahren.
Dabei ist mir aufgefallen, dass das Problem verschwindet, wenn ich schreibe:
ul.MenuBarHorizontal#navigation_menu ul li {
white-space: nowrap;
display: block;
float: none;
width: auto;
}
anstatt:
ul.MenuBarHorizontal ul li {
display: block;
float: none;
width: auto;
white-space: nowrap;
}
#navigation_menu ist dabei das id des Menüs (des <ul> Tags).
Hat vielleicht jemand eine Ahnung, warum das so ist?
Würde mich brennend interessieren!
Viele Grüße
Simon
Om nah hoo pez nyeetz, Simon!
Dabei ist mir aufgefallen, dass das Problem verschwindet, wenn ich schreibe:
> ul.MenuBarHorizontal#navigation_menu ul li {
> white-space: nowrap;
> display: block;
> float: none;
> width: auto;
> }
anstatt:
ul.MenuBarHorizontal ul li {
> display: block;
> float: none;
> width: auto;
> white-space: nowrap;
> }
ersteres ist ein Selektor höherer [ref:self812;css/formate/kaskade.htm#spezifitaet@title=Spezifität] (0113 gegen 0013)
Matthias
Hallo,
ul.MenuBarHorizontal#navigation_menu ul li
ul.MenuBarHorizontal ul li
ersteres ist ein Selektor höherer http://de.selfhtml.org/css/formate/kaskade.htm#spezifitaet@title=Spezifität (0113 gegen 0013)
mit anderen Worten: Irgendwo muss eine weitere Regel existieren, die auf ul.MenuBarHorizontal ul li (ohne ID) zutrifft und eine oder mehrere der vier Eigenschaften nochmal anders setzt.
So long,
Martin
Om nah hoo pez nyeetz, Der Martin!
mit anderen Worten: Irgendwo muss eine weitere Regel existieren, die auf ul.MenuBarHorizontal ul li (ohne ID) zutrifft und eine oder mehrere der vier Eigenschaften nochmal anders setzt.
Ja, mehr lässt sich aufgrund der dürftigen Fehlerbeschreibung nicht sagen.
Matthias
Danke für eure Antworten!
Mir íst schon klar, dass es da irgendetwas geben muss, was die Regel dann wieder überschreibt. Aber was? Hier sind mal alle Selektoren meines angepassten Spry-Menüs:
ul.MenuBarHorizontal
ul.MenuBarActive
ul.MenuBarHorizontal li
ul.MenuBarHorizontal ul
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
ul.MenuBarHorizontal ul li
ul.MenuBarHorizontal ul ul
ul.MenuBarHorizontal li ul li
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
ul.MenuBarHorizontal a
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
ul.MenuBarHorizontal iframe
ul.MenuBarHorizontal li.MenuBarItemIE
Wobei ich nun eben "ul.MenuBarHorizontal ul li
" durch "ul.MenuBarHorizontal#navigation_menu ul li
" ersetzen muss, damit es funktioniert...
Könnt ihr mir bitte nochmal helfen?
Danke & Gruß
Simon
Om nah hoo pez nyeetz, Simon!
Es ist zwar klug, sprechende Variablennamen zu verwenden, aber man kann es auch übertreiben.
Dreamweaver erstellt ein grausiges CSS. In einem solchen Beispiel sollte man mit einer einzigen ID bzw Klasse auskommen und konsequent mit dem Nachfolgeselektor arbeiten.
#nav ul li ul li beispielsweise und abhängig vom html.
Matthias
Om nah hoo pez nyeetz, Simon!
Es ist zwar klug, sprechende Variablennamen zu verwenden, aber man kann es auch übertreiben.
Dreamweaver erstellt ein grausiges CSS. In einem solchen Beispiel sollte man mit *einer einzigen* ID bzw Klasse auskommen und konsequent mit dem Nachfolgeselektor arbeiten.
#nav ul li ul li beispielsweise und abhängig vom html.
Matthias
Danke Matthias,
das kommt so - wie du auch festgestellt hast - von Dreamweaver! Ich möchte die Systematik auch nicht ändern, da das Spry-Menü auch Javascript verwendet, von dem ich leider keine Ahnung habe :-(
Gruß
Severin
Hi,
Mir íst schon klar, dass es da irgendetwas geben muss, was die Regel dann wieder überschreibt. Aber was?
Firebug o.ä. nehmen, und nachschauen.
MfG ChrisB