Pryos.org: :active bei untergeordneten Elementen (IE)

Beitrag lesen

SELF-Forum

:active bei untergeordneten Elementen (IE)

Pryos.org
– Informationen zu den Bewertungsregeln

welcher? alle?

IE6-8.

Im IE gibt es unter F12 die Entwicklertools.
HTML und CSS validiert?

Validate by Direct Input: Success

Schreibfehler?

Nein, alle anderen funktionieren wie gewünscht.

Quirksmodus?

Nein.

Grundsätzlich ist
.button:active span ein gültiger selektor.

Grundsätzlich nimmt jeder richtige Browser mein Beispiel an und führt es wie gewünscht aus, nur der IE nicht.

/-A----------------------------------------------\ |/-SPAN-------------------\                      |
||TEXT (Hier kein :active | (hier geht :active)  |
|------------------------/                      |
------------------------------------------------/

Die derzeitige komplette Test-Webseite:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
	<title>Test</title>  
	<meta http-equiv="X-UA-Compatible" content="IE=8" />  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
	  
	<style type="text/css">  
	a.button {display: inline-block;display: -moz-inline-box; height:22px; background: url(n-button.png) no-repeat right 0px; 	margin:0 0 0 3px;padding: 0 20px 0 0;color: white;text-decoration:none;}  
	* html a.button  { display: inline;}  
	*:first-child+html a.button { display: inline;}  
	a.button span{display: inline-block;display: -moz-inline-box; height:22px; line-height: 22px;background: url(n-button.png) no-repeat left 0px; margin:0 0 0 -3px; padding: 0 0 0 12px;}  
	* html a.button span{ display: inline;}  
	*:first-child+html a.button span{ display: inline;}  
	a.button:hover, a.button:focus {background-position: right -22px;}  
	a.button:hover span, a.button:focus span{background-position: left -22px;}  
	a.button:active {background-position: right -44px;}  
	a.button:active span{background-position: left -44px;}  
	</style>  
</head>  
<body>  
	<a href="#" class="button"><span>GRATIS ANFORDERN</span></a>  
</body>  
</html>

Die Grafik kann ich hier ja leider nicht hoch laden.

mfg Pryos

Matthias

Beitrag melden
–
Informationen zu den Bewertungsregeln