Seite 1 von 2

[HTML] Focusrect zu groß bei Bildlink mit STRICT Variante

Verfasst: 16.11.2007 21:04
von Fluid Byte
Wenn man ein Bild in einen <a> Tag einbindet um einen Blidlink zu erstellen wird die Gesamthöhe mit einer HTML/XHTML STRICT -Variante unterschiedlich berechnet als mit Transitional. Ich habe aber keinen Schimmer warum.

Code mit HTML Transitional:

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<body>
<table width="250" height="190" border="0" cellpadding="2" cellspacing="2" bgcolor="#999999">
  <tr>
    <td align="center" valign="middle" bgcolor="#FFFFFF"><a href="http://codedreality.purearea.net/"><img src="http://codedreality.purearea.net/temp/wahrsagerin.jpg"></a></td>
  </tr>
</table>
</body>
</html>
Ergebniss:
Bild

Code mit HTML Strict:

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<body>
<table width="250" height="190" border="0" cellpadding="2" cellspacing="2" bgcolor="#999999">
  <tr>
    <td align="center" valign="middle" bgcolor="#FFFFFF"><a href="http://codedreality.purearea.net/"><img src="http://codedreality.purearea.net/temp/wahrsagerin.jpg"></a></td>
  </tr>
</table>
</body>
</html>
Ergebniss:
Bild

Es ist möglich den überstehenden Whitespace zu entfernen wenn man beiden <img> Tags style="display: block;" hinzufügt aber dann ist das Focusrect futsch.

Verfasst: 16.11.2007 21:11
von DarkDragon
Nur falls nichts anderes angeboten wird:
Mach den Focusrect einfach weg mit JS

Code: Alles auswählen

onfocus='this.blur()'
im HTML Tag. :freak:

Verfasst: 16.11.2007 21:41
von Fluid Byte
Fluid Byte hat geschrieben:Es ist möglich den überstehenden Whitespace zu entfernen wenn man beiden <img> Tags style="display: block;" hinzufügt aber dann ist das Focusrect futsch.

Verfasst: 16.11.2007 22:51
von AND51
hast du vielleicht überflüssige Leerzeichen/Linebreaks noch innerhalb der Zelle/rund um das Image?
Ansonsten kann ich mir momentan auch keinen Reim darauf machen.

P.S.: Musst du denn unbedingt alles in STRICT machen? Oder reicht für dein Projekt nicht auch TRANSITIONAL?

> HTML/XHTML STRICT -Variante
Also bei XHTML muss definitiv jedes Tag abgeschlossen werden! Und wenn du ein Standalone Tag hast, machst du entweder

Code: Alles auswählen

<img src="and51.png"></img>
(seltenere Variante) oder das hier:

Code: Alles auswählen

<img src="and51.png" />
---------------------^
Sonst ist es kein gültiger XHTML-Code. Möglicherweise (ich hoffe, dieser Satz ist kein Blech), liegt das Fehlerhafte Focusrect daran!

Verfasst: 16.11.2007 23:19
von Fluid Byte
AND51 hat geschrieben:hast du vielleicht überflüssige Leerzeichen/Linebreaks noch innerhalb der Zelle/rund um das Image?
Definitiv nicht.
AND51 hat geschrieben:P.S.: Musst du denn unbedingt alles in STRICT machen? Oder reicht für dein Projekt nicht auch TRANSITIONAL?
Nein, alles STRICT.
AND51 hat geschrieben:> HTML/XHTML STRICT -Variante
Also bei XHTML muss definitiv jedes Tag abgeschlossen werden! Und wenn du ein Standalone Tag hast, machst du entweder

Code: Alles auswählen

<img src="and51.png"></img>
(seltenere Variante) oder das hier:

Code: Alles auswählen

<img src="and51.png" />
---------------------^
Ganz behämmert bin ich auch nicht...Bild
AND51 hat geschrieben:Sonst ist es kein gültiger XHTML-Code. Möglicherweise (ich hoffe, dieser Satz ist kein Blech), liegt das Fehlerhafte Focusrect daran!
Ich benutze HTML, nicht XHTML. Bild

Verfasst: 16.11.2007 23:32
von AND51
> Ganz behämmert bin ich auch nicht
Das sag ich ja auch nicht. Aber wenn du von XHTML sprichst, gehe ich davon aus, dass du es verwenden möchtest. Daher musst du die Tags korrekt schließen. Das hast du im Beispielcode aber nicht getan.


Zum Thema:
Ich habe eine alternative Idee. Versuch doch mal, beim IMG- oder A-Tag folgendes hinzuzugügen:

Code: Alles auswählen

<a href="bla.htm" style="width:200px;height:300px;">
   <img src... />
</a>
Damit kannst du die Dimensionen des A-Tags eingrenzen (hoffe ich). Musst natürlich nur die Dimensionen des Bildes eintragen. Oder du lässt die DImensionen automatisch/dynamisch von JavaScript eintragen.

Verfasst: 17.11.2007 17:47
von Fluid Byte
Nah, funzt nicht. Bild

Verfasst: 17.11.2007 18:13
von AND51
Ich denke, deine hübsche Wahrsagerin kann auch ohne Border leben, daher probier doch mal im IMG-Tag:
BORDER="0"
Denn du weißt ja, dass bei Bildern, die sich in einem Link befinden, automatisch ein Rand angefügt wird.

Verfasst: 17.11.2007 18:49
von Fluid Byte
In wie fern hat das mit meinem Problem zu tun?

Verfasst: 17.11.2007 19:32
von AND51
Durch Rahmen vergrößern sich die Dimensionen eines Elements. Ich kann mittlerweile auch nur raten, da ich nicht viel in STRICT mache; aber vielleicht hat eben der Rahmen was mit diesem Problem zu tun.