Hallo Leute,
ich brauch dringend eure Hilfe.
ich bin gerade dabei originale Twentyten-Menü zu modifizieren.
Trotz Google und Selfhtml bin ich mir noch nicht ganz sicher was ich falsch mache.
Schaut euch mein Menü erst mal hier an.
Was ich erreichen wollte ist das das Menü horizontal ist aber nicht nur bei der
ersten Liste sondern auch bei allen Sublisten. So das ich am ende 3 horizontale Zeilen habe die sich über die ganze Seite erstreckt und die Buttons mittig sind so wie bei der ersten Zeile.
Die erste Liste tut dies.
Die zweite dropt leider immer unter der Position des Buttons.
Die dritte auch an der Position des Subbuttons.
Ich weiss meine Frage ist sehr wage und undefiniert.
Ich glaube ich habe das ganze ul li a noch nicht ganz verstanden.
Dazu habe ich das hier studiert:
http://de.selfhtml.org/css/layouts/navigationsleisten.htm
Da aber die divs im twentyten alle #access ul oder ähnlich heissen komme ich glaube ich ein wenig durcheinander. Vielleicht könnt ihr mir zu ein wenig Ordnung verhelfen.
Ich bin mir nicht sicher wie die listen im css angesprochen werden
vielleicht liegt darin der Fehler:
ERSTE MENÜ ZEILE
#ul
{TEST}
#li
{TEST}
ZWEITE MENÜ ZEILE VARIANTE 01
#ul ul
{TEST}
#ul ul li
{TEST}
ZWEITE MENÜ ZEILE VARIANTE 02
#ul li ul
{TEST}
#ul li ul li
{TEST}
Alles anzeigen
Welche Version ist richtig?
Für die die alles sehen wollen hier
mein gesamter CSS-Code:
#access { border-bottom: 1px dashed #000000;
border-top: 1px dashed #000000;
display: block;
float: left;
margin: 0 auto;
text-transform: uppercase;
width: 100%;
}
#access .menu-header, div.menu {
font-size: 11px;
width: 444px;
}
#access .menu-header ul, div.menu ul {
list-style: none outside none;
margin: 0;
}
#access .menu-header li, div.menu li {
float: left;
position: relative;
}
#access a {
color: #000000;
display: block;
line-height: 16px;
padding: 0 10px;
text-decoration: none;
}
#access ul li ul {
display: none;
position: absolute;
width: 728px;
border-bottom: 1px dashed #000;
}
#access ul li ul li {
display: inline;
width: 100px;
}
#access ul li ul a {
float: left;
height: auto;
line-height: 1em;
padding: 5px;
text-align: center;
width: 90px;
}
#access ul li ul li ul {
padding-top: 21px;
border-bottom: 1px dashed #000;
}
#access ul li ul li ul li {
width: 150px;
}
#access ul ul ul a {
width: 150px;
}
#access li:hover > a, #access ul ul *:hover > a {
color: #E1DDD1;
}
#access ul li:hover > ul {
display: block;
}
#access ul li.current_page_item > a, #access ul li.current-menu-ancestor > a, #access ul li.current-menu-item > a, #access ul li.current-menu-parent > a {
color: #000000;
}
* html #access ul li.current_page_item a, * html #access ul li.current-menu-ancestor a, * html #access ul li.current-menu-item a, * html #access ul li.current-menu-parent a, * html #access ul li a:hover {
color: #FFFFFF;
}
Alles anzeigen
Vielen Dank euch schon mal!
Besten Gruß
