182: <ul> <li> <ul> <li> Verschachtelung Schriftfarbe Problem

Beitrag lesen

Hi,

<ul id="navlist">
<li class="normal"><a href="#">Item one</a></li>
<li class="active">Item two

#navlist li
{
    color:#f6e0b1;
    font-size:11px;
list-style: none;
margin: 0;
padding: 0.25em;
border-top: 1px solid gray;
}

#navlist li a,.active{

Dir ist bewußt, daß auf das <li class="active">
sowohl die Regeln, die Du für
.active
als auch die, die Du für
#navlist li
definiert hast, zutreffen, wobei letztere ein höheres Gewicht haben.

Insbesondere bedeutet
#navlist li a, .active { /*irgendwas*/ }
dasselbe wie
#navlist li a { /*irgendwas*/ }
.active { /*irgendwas*/ }

Es bedeutet NICHT:
#navlist li a { /*irgendwas*/ }
#navlist li .active { /*irgendwas*/ }

#navlist li ul li,.subactive, .subnormal{

Auch hier: das bedeutet:
.subactive { /* irgendwas */ }
.subnormal { /* irgendwas */ }
#navlist li ul li { /* irgendwas */ }

Wozu brauchst Du da überhaupt in jedem li und im inneren ul eine Klasse?
Die sind doch alle aufgrund der Struktur einfach ansprechbar.
Z.B. das innere ul über #navlist ul

cu,
Andreas

Hi Andreas

danke für die Tipps und Ratschläge,
ich habe jetzt noch mal mein CSS Teil angepasst soweit ich dich verstanden habe. Jedoch zeigt er mir jetzt alle Menüpunkte, egal ob Oberpunkt oder submenü in blauer farbe an und besuchte Menüpunkte in lila.
dabei habe ich doch in meinem CSS die Farbe ganz klar festgelegt?!
hier mein upgedatetes CSS Skript

  
#navlist{  
/*color:#f6e0b1;*/  
padding-left:0;  
margin-left:0;  
border-bottom:1px solid gray;  
width:160px;  
font-size:11px;  
font-weight:bold;  
}  
#navlist ul{  
/*color:#000;*/  
padding-left: 0;  
margin-left: 0;  
width: 160px;  
background-color:#f6e0b1;  
font-size:11px;  
text-align:left;  
font-weight:bold;  
}  
/*------*/  
.normal{  
color:#f6e0b1;  
font-size:11px;  
list-style: none;  
margin: 0;  
border-top: 1px solid gray;  
padding:0.25em 15px 0 0;  
font-weight:bold;  
}  
.active{  
color:#f6e0b1;  
font-size:11px;  
list-style: none;  
margin: 0;  
border-top: 1px solid gray;  
padding:0.25em 15px 0 0;  
font-weight:bold;  
}  
.subnormal{  
color:#000;  
font-size:11px;  
list-style: none;  
margin: 0;  
padding:0.25em 0 0 15px;  
border-top: 1px solid gray;  
text-align:left;  
background-color:f6e0b1;  
background-image: url(arrow.gif);  
background-repeat: no-repeat;  
background-position: 0px 3px;  
  
}  
.subactive{  
color:#000;  
font-size:11px;  
list-style: none;  
margin: 0;  
padding:0.25em 0 0 15px;  
border-top: 1px solid gray;  
text-align:left;  
background-color:f6e0b1;  
background-image: url(arrow.gif);  
background-repeat: no-repeat;  
background-position: 0px 3px;  
}