[chrisnrw]

Hallo zusammen,

ich habe hier ein Problem wo ich nicht durchsteige.

Folgendes HTML für ein Menü mit Tabs in Joomla:

<div>
<ul id="mainleveltab">
<li id="active1" class="item3"><a href="/portal/seite1"><span>Menüpunkt1</span></a></li>
<li id="active" class="item2"><a href="/portal/seite2">Menüpunkt2</a></li>
<li id="active" class="item679"><a href="/portal/seite3">Menüpunkt3</a></li>
<li id="active" class="item680"><a href="/portal/seite4">Menüpunkt4</a></li>
<li id="active" class="item681"><a href="/portal/seite5">Menüpunkt5</a></li></ul>
</div>

Folgendes CSS:

#mainleveltab a{
color: #000;
background: url("../images/tab_left.png") left top no-repeat;
text-decoration: none;
padding-left: 10px;
margin-right:4px;
height:19px;
padding-top:5px;
display:inline-block;
display:-moz-inline-block;
}

#mainleveltab a span
{
background: url("../images/tab_right.png") right top no-repeat;
padding-right: 10px;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:#fff;
height:24px;
padding-top:5px;
position:relative;
top:-5px;
display:inline-block;
display:-moz-inline-block;
}

#mainleveltab #active1 a {
background: url("../images/tab_left_current.png") left top no-repeat;
text-decoration: none;
padding-left: 10px;
margin-right:4px;
height:19px;
padding-top:5px;
display:inline-block;
display:-moz-inline-block;
}


#mainleveltab #active1 a span
{
background: url("../images/tab_right_current.png") right top no-repeat;
color:#e98932;
}

Es geht darum den aktiven Menüpunkt, also #active1 zu gestalten.
2 Buttons müssen allerdings auf grund des Header-Hintergrunds ein
anderes Hintergrundbild wie die sonstigen Menüpunkte erhalten.

Darum habe ich folgendes versucht:

#mainleveltab #active1 .item3 a span
{
background: url("../images/tab_right_current3.png") right top no-repeat;
color:#e98932;
}

Leider wird diese Definiton nicht beachtet, der gibt einfach anstatt
"tab_right_current3.png" die Hintergrundgrafik "tab_right_current.png"
aus wie bei allen anderen Menüpunkten.

Kann mir jemand sagen was ich falsch mache ?

Ich verstehe nicht warum der nicht auf
#mainleveltab #active1 .item3 a span reagiert.

Vielen Dank schonmal und Viele Grüße

Christian

[EvT]

Es gibt einen Unterschied zwischen #active1 .item3 und #active1.item3 ...

Zum Nachlesen: Multiple Class / ID and Class Selectors

[chrisnrw]

Vielen Dank, das wars

[uspri]

Zitat von chrisnrw

Folgendes HTML für ein Menü mit Tabs in Joomla:

<div>
<ul id="mainleveltab">
<li id="active1" class="item3"><a href="/portal/seite1"><span>Menüpunkt1</span></a></li>
<li id="active" class="item2"><a href="/portal/seite2">Menüpunkt2</a></li>
<li id="active" class="item679"><a href="/portal/seite3">Menüpunkt3</a></li>
<li id="active" class="item680"><a href="/portal/seite4">Menüpunkt4</a></li>
<li id="active" class="item681"><a href="/portal/seite5">Menüpunkt5</a></li></ul>
</div>

Eine ID darf nur EINMAL vorkommen, Klassen mehrfach.