bob: Rollover IE

Hallo,

habe folgendes Problem:
CSS:

  
a:link, a:visited{color:#666666;}  
a:hover{color: #99CC33;}  
  
a.butbild:link, a.butbild:visited{  
width:15px;  
height:15px;  
margin:5px 5px 0px 0px;  
display:block;  
text-decoration:none;  
text-align:center;  
border: 1px solid #999999;  
float:left;  
line-height:15px;  
}  
  
a.activ{background-color:#99cc33; color:#FFFFFF;}  

HTML:

  
<a class="butbild activ" href="#">1</a>  

So, mit a.activ will ich einen Link im activem Zustand darstellen. d.h. die Schriftfarbe und die Hintergrundfarbe soll anders sein.
Im FF ist es auch so, im IE aber nicht.
Der IE setzt die Schriftfarbe nicht auf weiss.
Wo ist der Fehler?

Gruss, Bob?

  1. Wo ist der Fehler?

    Im Browser natürlich.

    IE kennt die Pseudoklassen :hover, :link etc. nur auf dem unberührten Element a

    1. IE kennt die Pseudoklassen :hover, :link etc. nur auf dem unberührten Element a

      na gut!

      1. Ich nochmal,

        a.activ{background-color:#99cc33; color:#FFFFFF;}

          
        das ist meine Lösung:  
        ~~~css
          
        a.activ:link, a.activ:hover{background-color:#99cc33; color:#FFFFFF;}  
        
        

        gruss bob

    2. Hi,

      IE kennt die Pseudoklassen :hover, :link etc. nur auf dem unberührten Element a

      was soll denn das nun heißen?
      Der ehler beim IE liegt woanders: im Gegenatz zu anderen Browsern gewichtet er Pseudoklassen höher als andere Klassen. Es gäbe folgende Lösungen:

      • a#activ verwenden; eine ID hat auch im IE eine höhere Spezifität.
      • a statt a:link und a:visited angeben; dann überschreibt nur noch a:hover die Klasse im IE und man müßte nur noch a.activ, a.activ:hover angeben.
      • einen zusätzlichen Selektor für eine höhere Spezifität im IE angeben, z.B. body a.activ.

      freundliche Grüße
      Ingo