Bug in Safari (3.2.1) oder mache ich was falsch?
rastersafari
- browser
Hallo,
Safari zeigt Outline um einen Link mit Image nur in der Höhe der Schriftgröße (14px) an. Beispiel funktioniert auch ohne das Einfügen eines Bildes:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
a:link {
outline: 1px solid;
}
</style>
</head>
<body>
<a href="">
<img src="x" height="50px" width="50px">
</a>
</body>
</html>
Folgenden - so gar nicht befriedigenden - Workaround habe ich gefunden:
<a style="font-size:56px" href="">
Hi,
Safari zeigt Outline um einen Link mit Image nur in der Höhe der Schriftgröße (14px) an.
FF ebenso.
Folgenden - so gar nicht befriedigenden - Workaround habe ich gefunden:
Du kannst a floaten oder outline/border für das image und nicht für das a-tag definieren.
Gruesse, Joachim
Hi,
»» Safari zeigt Outline um einen Link mit Image nur in der Höhe der Schriftgröße (14px) an.
FF ebenso.
FF (3.0.6) hat bei mir dieses Problem nicht.
»» Folgenden - so gar nicht befriedigenden - Workaround habe ich gefunden:
Du kannst a floaten oder outline/border für das image und nicht für das a-tag definieren.
Ich würde gerne mit outline für das a-tag arbeiten, weil beim Arbeiten mit dem Image, die via "a:visited img" gestzte outline- und border-eigenschaft nicht richtig aufgefrischt wird, d. h. erst wenn der benutzer erneut das image hovert wird die visited-Eigenschft sichtbar.
Kann ich auch floaten ohne gleich das ganze Bild links oder rechts zu haben?
Gruß
»» Du kannst a floaten oder outline/border für das image und nicht für das a-tag definieren.
Ich würde gerne mit outline für das a-tag arbeiten, weil beim Arbeiten mit dem Image, die via "a:visited img" gestzte outline- und border-eigenschaft nicht richtig aufgefrischt wird, d. h. erst wenn der benutzer erneut das image hovert wird die visited-Eigenschft sichtbar.
Vielleicht ist der Effekt, den ich meine, doch etwas schwieriger zu rekonstruieren. Deshalb mal ein Beipsiel für den Safari:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
a:link img {
outline: 1px solid;
}
a:visited img {
outline: 1px hidden;
}
</style>
</head>
<body>
<a href="http://dict.leo.org" target="_blank">
<img src="x" height="50px" width="50px">
</a>
</body>
</html>
Funktionsweise: Klick auf den a-tag öffnet neues Fenster. Fenster schließen, fürt nicht zum refresh des image borders (nur der a-tag wird aufgefrischt). erst nach neu laden der seite wird die neue border-eigenschaft (hidden) übernommen.
@@rastersafari:
nuqneH
FF (3.0.6)
Autsch! 3.0.10 ist aktuell. Unbedingt updaten!
Qapla'
@@rastersafari:
nuqneH
»» FF (3.0.6)
Autsch! 3.0.10 ist aktuell. Unbedingt updaten!
Qapla'
Ist nicht mein System, sondern das meiner Uni. Da wird nicht jedes Update gleich durchgeführt.
@@rasterdafari:
nuqneH
Ist nicht mein System, sondern das meiner Uni. Da wird nicht jedes Update gleich durchgeführt.
Ziemlich unverantwortlich. Die Uni sollte dafür sorgen, dass der Systemadministrator seinen Aufgaben nachkommt und nicht Sicherheitslöcher scheunentorweit offen lässt.
Qapla'
Hallo,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Warum verwendest du den Quirks Mode?
In der Tat muss man hier spitzfindig sein um das Problem zu erkennen.
<a style="font-size:56px" href="">
Ich würde auch zu outline für das img-Element raten.
Gruß.
In der Tat muss man hier spitzfindig sein um das Problem zu erkennen.
Ach ja :-) Das Problem ist, dass die Zeilenhöhe nicht mit dem Bild mitwächst sondern dieses ignoriert.
Hallo,
»»
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Warum verwendest du den Quirks Mode?
Habe jetzt es jetzt mal ohne Quirks Mode versucht.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Das Problem ist nur, dass jetzt mein workaround gar nicht mehr funktioniert, weil das outline zu weit unten ist (entsprechend dem Text, der auch weiter unten erscheint).
»»
<a style="font-size:56px" href="">
Ich würde auch zu outline für das img-Element raten.
Outline um das img-element ist nicht so gut, s. anderen Post von mir.
Noch andere Ideen? Ist das jetzt eigentlich ein Bug, oder schlechtes Handwerk meinerseits?