[festiz]

www.bkeva.se/dev/

Jag utvecklar en site som just nu fungerar utmärkt i mozilla-baserade webbläsare eftersom de stöder :hover på alla element, men Explorer stöder det bara på a-element så nu börjar det bli jobbigt. Finns det något sätt att påverka föräldern li till a när a:hover? Jag vill lägga en bakgrund i li-elementet så att jag uppnår önskad effekt.

Det går tyvärr inte lägga den i a-elementet eftersom den redan har en egen bakgrund som ligger top right no-repeat. Eftersom a-element som är li-elementets child har högre z-index så måste bakgrunderna ligga i denna ordning. li-elementet innehåller en bild som innehåller bakgrundens vänstra och mittersta(oändliga) del och a-elementet ska innehålla den avslutande högra bilden.

Jämför i Mozilla och IE. Den fungerar i Mozilla, men inte IE.. vad ska jag göra?

Regeln som ska användas men med en ny selector ser ut som följer:

#menu-content ul li:hover, #menu-content ul li#active {
	background: url(../images/menyflik.png);
}

[Kaffe]

Antingen får man lägga om sin struktur, med lite extra mark-up för att emulera samma effekt (flytta bara alla CSS-regler ett snäpp i hierarkin).

#menu-content ul li a:hover, #menu-content ul li a#active {
background: url(../images/menyflik.png);
}

Och HTML:

<div id="menu-content">
 <ul>
 <li><a href="#"><span>En länk</span></a></li>
 </ul>
</div>

Om inte det har du andra alterantiv:
http://htmldog.com/articles/suckerfish/hover/ - Använder javascript för att emulera beteendet. Rekommenderas.
http://www.xs4all.nl/~peterned/csshover.html - Använder .htc, något som enbart IE stödjer, så tanken är god.

[festiz]

Originally posted by Kaffe@Aug 14 2006, 10:30
Antingen får man lägga om sin struktur, med lite extra mark-up för att emulera samma effekt (flytta bara alla CSS-regler ett snäpp i hierarkin).

#menu-content ul li a:hover, #menu-content ul li a#active {
background: url(../images/menyflik.png);
}

Och HTML:

<div id="menu-content">
 <ul>
 <li><a href="#"><span>En länk</span></a></li>
 </ul>
</div>

Om inte det har du andra alterantiv:
http://htmldog.com/articles/suckerfish/hover/ - Använder javascript för att emulera beteendet. Rekommenderas.
http://www.xs4all.nl/~peterned/csshover.html - Använder .htc, något som enbart IE stödjer, så tanken är god.

tack.. ska titta på det!