img link zu gross im firefox

[ulf]

hi habe folgendes problem. auf meiner seite www.ackbytes.de habe ich im footer 2 links auf bildern mit folgendem code:

<a href="http://validator.w3.org/check?uri=referer"><img src="images/w3c_xhtml10.gif" alt="xhtml 1.0 strict" title="Validate the markup of this site" width="80" height="15" /></a>

das funktioniert auch einwandfrei bis ich per .css datei diese styles definiere:

/* generic link styles */
a {
 color: #6699CC;
 background-color: #fff;
 text-decoration:none;
}

a:hover {
 color: #FFFFFF;
 background-color: #008dd0;
 text-decoration:none;
}

jetzt ist das problem das im firefox die links einige pixel grösser sind als im ie. der ie hat keinerlei probleme und die links sind wirklich so gross wie das bild. beim firefox beginnt der link jedoch schon weit unter dem bild wie sehr schoen auf meiner seite zu sehen ist.

der footer in dem die links stehen ist folgendermassen definiert:

div#footer {
 width:100%;
 height:40px;
 background:#9B9B9B;
 text-align:center;
 color:#FAFAF5;
 clear:left;

}

ich weiss wirklich nicht mehr weiter habe schon alles mögliche probiert. vielen dank für mögliche hilfe!

mfg

[wahsaga]

hi,

jetzt ist das problem das im firefox die links einige pixel grösser sind als im ie. der ie hat keinerlei probleme und die links sind wirklich so gross wie das bild. beim firefox beginnt der link jedoch schon weit unter dem bild wie sehr schoen auf meiner seite zu sehen ist.

Das altbekannte "Unterlängen-Problem" (welches kein Problem, sondern definiertes verhalten ist).

Wurde erst vor zwei Tagen noch diskutiert - lies https://forum.selfhtml.org/?t=123958&m=798494

gruß,
wahsaga

[ulf]

hi,

jetzt ist das problem das im firefox die links einige pixel grösser sind als im ie. der ie hat keinerlei probleme und die links sind wirklich so gross wie das bild. beim firefox beginnt der link jedoch schon weit unter dem bild wie sehr schoen auf meiner seite zu sehen ist.

Das altbekannte "Unterlängen-Problem" (welches kein Problem, sondern definiertes verhalten ist).

Wurde erst vor zwei Tagen noch diskutiert - lies https://forum.selfhtml.org/?t=123958&m=798494

gruß,
wahsaga

Hey danke, habs gelesen habe nun die linkbilder als blocks definiert, damit habe ich allerdings das problem das der firefox nun jeden block auf eine neue zeile haut und man über die gesamte zeile denk link hovern kann....

):

[ulf]

So ich habe nun die line-height des Divs in dem die Bilder sind auf 5px gestellt. Die Bilder sind in Wirklichkeit 15px hoch.

Die Bilder lade ich nun mit vertical-align:bottom

Das hat folgenden Effekt: Im  Firefox ist das Div so gross wie das Bild, sobald ich aber die Maus übers Bild fahre entsteht oben wieder die Überlänge!

Im IE hingegen ist das Div genau um die Länge grösser die im Firefox oben dran gepappt wird beim hovern. Allderdings sieht man dort keine verlängerung wenn man hovert.

zu sehen auf: www.ackbytes.de

Danke schonmal für Hilfe ich sitz nun genau 2 Tage an dem Problem...

[wahsaga]

hi,

So ich habe nun die line-height des Divs in dem die Bilder sind auf 5px gestellt. Die Bilder sind in Wirklichkeit 15px hoch.

Und warum wählst du dann die line-height von 5px?

Setze zusätzlich noch height auf 5px, und ggf. overflow auf hidden.

gruß,
wahsaga