nicht angemeldet
Rahmen um Bilderlink
Hi,
ich hab ein Problem mit Rahmen um Bilderlinks.
Eigentlich sollte es ja ganz einfach sein, aber der Rahmen ist in Opera und Firefox nach unten verschoben. Im Internet Explorer sieht es dagegen so aus, wie ich es haben möchte.
Den Rahmen hab ich um den Link gemacht, weil der IE :hover leider nur bei a unterstützt.
Margin:0px oder padding:0px hat auch nicht geholfen.
Und hier das wichtigste vom Quelltext:
<html>
<head>
<title></title>
<style>
.icon { border : 1px solid green; }
img{ border-width : 0px; }
a:hover{ border : 1px solid red; }
</style>
</head>
<body>
<a href="#test" class="icon"><img src="test.jpg" /></a>
</body>
</html>
Gruß
TheHawk
-
Guten Tag TheHawk,
firefox macht es richtig. Wenn Sie die Klasse icon und das .hover zum Anker <a> schreiben, wird der Rahmen natürlich auch um den Anker gesetzt! Wenn Sie dagegen die Klasse zum <img> setzen und auch entsprechen im style-Bereich img:hover - dann bekommt das Bild seinen Rahmen.
Mit Gruß
Dada -
Hi,
Eigentlich sollte es ja ganz einfach sein, aber der Rahmen ist in Opera und Firefox nach unten verschoben.
zu Recht, da Bilder per default an der Baseline ausgerichtet werden, um Platz für Unterlängen zu reservieren. Und da Du dies nicht anders definiert hast...
Den Rahmen hab ich um den Link gemacht, weil der IE :hover leider nur bei a unterstützt.
der IE kann durchaus a:hover img {} - und setzt dies auch um, wenn Du zusätzlich noch Angaben zu a:hover {} machst, die ein neu-rendern bewirken.
freundliche Grüße
Ingo-
Das mit den zwei :hover hat funktioniert.
Danke für die schnelle Hilfe
TheHawk
-