fehlender >-Selektor beim IE6 umgehen

[André]

Hallo,
ich habe folgendes Problem.
Auf einer Seite habe ich folgendes Menü:

<div id="navigation">
<ul>
  <li><a href="#top">Link1</a></li>
  <li><a href="#top">Link2</a></li>
  <li id="menu6" class="selected"><a href="#top">Links3</a>
    <ul>
       <li><a href="#top">U-Link1</a></li>
       <li class="selected"><a href="#top">U-Link2</a></li>
       <li><a href="#top">U-Link3</a></li>
    </ul>
  </li>
  <li><a href="#top">Link3</a></li>
</ul>
</div>

Links soll immer ein Pfeil erscheinen als Hintergrundgrafik:

#navigation ul li a:hover {
 background-image:url('menupfeil.gif');
 background-repeat: no-repeat;
 background-position: left center;
 padding-left: 15px;
}

ebenso bei den Untermenüs:

#navigation ul ul li a:hover {
 background-image:url('menupfeil.gif');
 background-repeat: no-repeat;
 background-position: left center;
}

Nicht jedoch, wenn der Eintrag selektiert ist, also class="selected":

.selected > a {
 background-image:url('menupfeil.gif');
 background-repeat: no-repeat;
 background-position: left center;
}

Das funktioniert gut im Firefox2 und IE7. Nicht jedoch im IE6, weil der den >-Selektor ja nicht kennt. Hat einer von Euch eine Idee?
Mein Problem dabei ist immer, dass in bei allen anderen Versuchen entweder gar keine Pfeile fest angezeigt werden, oder bei allen Untermenüpunkten. :-((
Ich vermute, dass ich da irgendeinen logischen Denkfehler mache, vielleicht kann mir ja von Euch einer weiterhelfen! :-))

Schon mal jetzt vielen Dank,

André

[Powl]

Hallo,

Sofern das ungefähr so aussieht:

<element class="selected"><a href....>Link</a></element>

lass das > doch einfach mal weg.

.selected a {bla:blubb;}

netten Tag
^da Powl

[rfb]

Moin

du scheinst eh das mit den verschachtelten Selektoren etwas kompliziert zu sehen:

#navigation ul li a:hover {

ist hier das gleiche wie

#navigation a:hover

denn andere Links als die innerhalb <li> (die natürlich innerhalb eines <ul> stehen) gibts bei dir nicht

damit sind auch die

#navigation ul ul li a:hover {

bereits festgelegt. Somit wäre diese Anweisung komplett überflüssig.

Gruß
rfb

[André]

Moin

du scheinst eh das mit den verschachtelten Selektoren etwas kompliziert zu sehen:

#navigation ul li a:hover {

ist hier das gleiche wie

#navigation a:hover

denn andere Links als die innerhalb <li> (die natürlich innerhalb eines <ul> stehen) gibts bei dir nicht

damit sind auch die

#navigation ul ul li a:hover {

bereits festgelegt. Somit wäre diese Anweisung komplett überflüssig.

Gruß rfb

Das habe ich gemacht, weil ich für die Untermenüs noch andere Designsachenfestgelegt habe (Schriftgröße usw.), die anders sind als in der Hauptebene des Menüs. Das hatte ich hier nur weggelassen, um die Sache zu vereinfachen. Was ich mich jetzt eben frage: Wie kann ich, wenn dem li-Tag die Klasse zugewiesen ist, dem enthaltenen a-Tag diese Eigenschaft zuweisen, ohne dass die ganzen anderen enthaltenen a-Tags im Untermenü innerhalb dieses li-Tags diese Eigenschaften auch bekommen. Der >-Selektor war da für mich eine Lösung, aber wohl eben nicht für den IE6... :-(

Ideen?

[Powl]

Hallo,

Was ich mich jetzt eben frage:
Wie kann ich, wenn dem li-Tag die Klasse zugewiesen ist, dem enthaltenen a-Tag diese Eigenschaft zuweisen, ohne dass die ganzen anderen enthaltenen a-Tags im Untermenü innerhalb dieses li-Tags diese Eigenschaften auch bekommen.
Der >-Selektor war da für mich eine Lösung, aber wohl eben nicht für den IE6... :-(

Ideen?

Dann _wäre_ der > Selektor sicher gut, nur leider nicht für Browser, die ihn nicht kennen. In dem Fall musst Du es eben umständlich lösen und es für Dumme gaaaanz langsam erklären was Du willst:
Für .selected a {...}
    .selected ul a {...}
etc. Das macht den IE beim schreiben von Webseiten halt zu einem Hassobjekt. Sein schlechter Ruf muss aber ja irgendwo herkommen ;)
(Entweder nix verstaan oder falsch verstaan. IdiotEben.)

netten Tag
^da Powl