Dominik S.: Unterstrichene Bilder

Hallo!

Ich habe folgendes Problem mit Mozilla 1.6 und Dokumenten, die als HTML 4.01 Transitional deklariert sind: Grafiken, die innerhalb eines Link-Tags sind, werden auch unterstrichen! (Dazu am Ende meines Posts etwas Beispiel-Code.) Ob das im HTML-Standart so vorgesehen ist, weiß ich nicht, aber ich finde es sehr unschön. Ohne Angabe eines Doctypes tritt das Problem auch nicht auf.
Meine Frage: Gibt es eine _einfache_ Möglichkeit, das abzuschalten? Ich möchte nur ungerne noch ein zusätzliches Tag mit Style-Angaben um das <img>-Tag legen. Und auch zwei seperate <a> (eines um die Grafik, das andere um  den Text) fänd ich nicht so schön.

Danke,
Dominik

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>

<a href="test.html"><img src="http://forum.de.selfhtml.org/src/xweb.gif" border="0">Dies ist ein Test</a>

</body>
</html>

  1. abend,

    also um ein style-attribut kommst du AFAIK nicht dran vorbei...
    <a href=# style="text-decoration:none;"><img src=# border=0>test</a>

    HIH

    mfg,
    (tanz das)
    Z.N.S.

    --
    <img src="http://www.dmp-web.de/comunicout/neubauten.gif" border="0" alt="">
    1. also um ein style-attribut kommst du AFAIK nicht dran vorbei...
      <a href=# style="text-decoration:none;"><img src=# border=0>test</a>

      Dann ist der Text aber nicht mehr unterstrichen, der soll doch unterstrichen sein.

      Weiß jemand, ob das so, wie es in der aktuellen Mozilla-Version implementiert ist, korrekt ist? Oder ist das ein Bug?

      1. Hallo,

        also um ein style-attribut kommst du AFAIK nicht dran vorbei...
        <a href=# style="text-decoration:none;"><img src=# border=0>test</a>

        Dann ist der Text aber nicht mehr unterstrichen, der soll doch unterstrichen sein.

        Weiß jemand, ob das so, wie es in der aktuellen Mozilla-Version implementiert ist, korrekt ist? Oder ist das ein Bug?

        Das ist kein Bug.
        http://www.w3.org/TR/REC-CSS2/text.html#lining-striking-props

        If it is specified for (or affects) an inline-level element, it affects all boxes generated by the element. If the element has no content or no text content (e.g., the IMG element in HTML), user agents must ignore this property.

        Also werden Bilder nur nicht unterstrichen, wenn sie der _einzige_ Inhalt des A-Elements sind. Das ist auch sinnvoll, weil Bilder ja auch mitten im Text stehen können.

        So:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
                "http://www.w3.org/TR/html4/strict.dtd">
        <html>
        <head>
        <title>IMG als Link</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        </head>
        <body>
        <p><a href="test.html"><img src="http://forum.de.selfhtml.org/src/xweb.gif" alt="web" style="border:0 none;"></a><a href="test.html">Dies ist ein Test</a></p>
        </body>
        </html>

        viele Grüße

        Axel

        1. Das ist kein Bug.
          http://www.w3.org/TR/REC-CSS2/text.html#lining-striking-props

          If it is specified for (or affects) an inline-level element, it affects all boxes generated by the element. If the element has no content or no text content (e.g., the IMG element in HTML), user agents must ignore this property.

          Danke für den Link. Dann ist wohl tatsächlich ein Workaround nötig. Ich hab noch eine Variante gefunden, die mir deutlich besser gefällt, als Deine:

          <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
          <html>
          <body>
          <a href="test.html" style="text-decoration: none;"><img src="http://forum.de.selfhtml.org/src/xweb.gif" alt="web" border="0"><u>Dies ist ein Test</u></a>
          </body>
          </html>

          1. Hallo Dominik,

            <a href="test.html" style="text-decoration: none;"><img src="http://forum.de.selfhtml.org/src/xweb.gif" alt="web" border="0"><u>Dies ist ein Test</u></a>

            Warum packst Du das style="text-decoration: none;" nicht einfach ins Image-Tag, oder noch besser in die Style-Datei:

            img { text-decoration: none; }

            Grüße
            Andreas

            --
            "Programming today is a race between software engineers striving to build bigger and better idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning."
            (Rich Cook)
          2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
            <html>
            <body>
            <a href="test.html" style="text-decoration: none;"><img src="http://forum.de.selfhtml.org/src/xweb.gif" alt="web" border="0"><u>Dies ist ein Test</u></a>
            </body>
            </html>

            Sorry, dieses Dokument ist nicht als HTML 4.01 Strict gültig

            Grüße
            Validator

            http://validator.projektmedien.de/file-upload.html