CSS-Hover Effekte - Firefox vs. Safari

Trash

Erfahrenes Mitglied
Hallo,
ich entwickle auf einem Mac inkl. Safari und Firefox und habe z.B. folgende Struktur:

Code:
a:link {color:#3F3F3F;text-decoration:none;}
a:visited {color:#3F3F3F;}
a:hover {color:#000;text-decoration:underline;}
a:active {color:#3F3F3F;}

.cellmenu {
	border: none;
	width: 100px;
	height: 60px;
	text-align:center;
	border: 1px solid #ffffff;
	padding: 4px;
	padding-top: 6px;
}

.cellmenu:hover {
	background-color:#f6f6f6;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border: 1px solid #c0c0c0;
}

Der Code sieht dann z.B. so aus:
HTML:
<div class="cell cellmenu">
		<a href="index.php?sbottom=calendar&sid=<?=session_id();?>">
			<img src="http://www.tutorials.de/includes/images/logo_calendar.png" height="33" />
			<span>Text</span>
		</a>
		</div>

Im Safari wird beim hovern über die Zelle diese grau hinterlegt und der Text im <span> wird unterstrichen. Im Firefox wird nur der Linktext im <span> unterstrichen, die Zelle wird aber nicht eingefärbt. Ich vermute, dass der Safari beide :hover-Elemente interpretiert und der Firefox nur das Element, welches innen liegt (also <a ) interpretiert. Wie bekomme ich es denn hin, dass auch der Firefox dies richtig anzeigt? Die Lösung, dass ich einfach .cellmenu a:hover definiere, sehe ich nicht, da dann ja nicht die ganze Zelle beim hovern grau hinterlegt wird?!

Wäre für einen Tipp sehr dankbar.

Danke!

Edit: Omg. Hat sich erledigt. Es lag daran, dass ich keinen Doc-Type angegeben hatte...
 
Zuletzt bearbeitet:
Zurück