Gernot Back: Linkrahmenhover: es geht auch ohne conditional comment

Beitrag lesen

Hallo Ingo,

aber gibt es auch eine einfachere Lösung, die ohne Conditional-Comment für den IE auskommt?
aber sicher doch:

a img { border:1px solid white; }
a:hover img { border-color: red; }

Dies funktioniert, wie bereits gesagt, wohl nicht in allen Browsern, aber es gibt doch eine Lösung ohne Conditional-Comment, die zumindest in den drei Browsern, mit denen ich unter Win98 getestet habe (MSIE 6, Opera 7.54, Mozilla 1.7.2) funktioniert:

a.rahmen {
  background-image: url(down_normal.gif);
  background-repeat: no-repeat;
  background-position: center;
  width: 52px;
  height: 52px;
  float:left;
  border: solid 1px #0000FF;
}

a.rahmen:hover {
  border-color: #00FF00;
}

Der Link sieht dann wie folgt aus:

<a href="#" class="rahmen"></a>

Jetzt wüsste ich ja nur noch gern, wieso Mozilla als einziger der getesteten Browser auch noch float:left benötigt, um den Grafik-Button überhaupt in voller Breite und Höhe anzuzeigen.

Ob das A-Element ohne Inhalt (ein &nbsp; steht auch nicht drin, sonst müsste ich auch noch text-decoration:none und font-size:1px; setzen) jetzt wirklich in allen Browsern angezeigt wird, können geneigte Leser nachfolgend ja mal testen und mir ggf. berichten, wenn es nicht der Fall sein sollte.

http://www.sprachlernspiele.de/selftests/pichighlight2.html

Gruß Gernot