rastersafari: Bug in Safari (3.2.1) oder mache ich was falsch?

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="">  

  1. 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

    --
    Am Ende wird alles gut.
    1. 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ß

      1. »» 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.

      2. @@rastersafari:

        nuqneH

        FF (3.0.6)

        Autsch! 3.0.10 ist aktuell. Unbedingt updaten!

        Qapla'

        --
        Bildung lässt sich nicht downloaden. (Günther Jauch)
        1. @@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.

          1. @@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'

            --
            Bildung lässt sich nicht downloaden. (Günther Jauch)
  2. 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ß.

    1. 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.

    2. 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?