manya: mehrer SPANs in a-Tag

Beitrag lesen

SELF-Forum

mehrer SPANs in a-Tag

manya
– Informationen zu den Bewertungsregeln

Wenn du den Selektor .link:hover   direkt hinter den Selektor .link setzt, funktioniert es auch im Firefox.

Klappt immer noch nicht, wenn ich den Text anklicke, funktioniert der Link nicht.

oh, ich glaube,ich hatte gestern nur im Safari getestet, und da funktionierte es irgendwann. Heute morgen seltsamerweise nicht mehr. :-/

Ich habe nochmal ein wenig herumprobiert, und dafür erstmal die Klassennamen geändert, da es so für mich übersichtlicher war.
Leider bin ich nicht zu einem Ergebnis gekommen.
Es funktioniert aber in Safari-4, Firefox-1.5 und IE-6, wenn du die Pseudoklasse :active komplett weglässt.

Wenn ich es mir recht überlege, hat es auch nicht so viel Sinn, für :active nochmal einen anderen Linktext anzuzeigen, denn :active ist ja nur der sehr kurze Moment des Anklickens.

Gruß
manya

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
"http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<title>Untitled Document</title>  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
  
<style type="text/css">  
  
body { background-color: #000000; }  
  
a {  
        width: 105px;  
        height: 30px;  
        color: yellow;  
        background-color:   #e0321f;  
        text-decoration:none;  
        display:block;  
        text-align:center;  
        margin-bottom: 5px;  
        padding: 5px;  
        border: 13px inset  red;  
}  
a:hover { border-color: blue;  }  
  
a:active { border-color: silver;  }  
  
  
  
a span.normal {   display:block;  }  
  
a span.mausdrueber {  display:none;  }  
  
a span.klick {  display:none;  }  
  
  
  
a:hover span.normal {  display:none;}  
  
a:hover span.mausdrueber {  display:block;   }  
  
a:hover span.klick {  display:none;  }  
  
  
  
  
  
/*  
a:active span.normal{  
        display:block;   color: black;  
   position: absolute;   top: -30px;  
}  
  
  
a:active span.mausdrueber{  
        display:block;  color: black;  
   position: absolute;   top: -30px;  
}  
  
a:active span.klick{  
        display:block; color: black;  
   position: absolute;   top: -30px;  
}  
  
*/  
</style>  
</head>  
  
<body>  
  
<a href="http://www.google.de" class="link">  
        <span class="normal">Unser Werdegang</span>  
        <span class="mausdrueber">und ab...</span>  
        <span class="klick">hilfe und weg</span>  
</a>  
  
</body>  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln