Problem mit Ausrichtung bei IE 5.5
Uwe Rupprecht
- html
0 Uwe Rupprecht0 molily
0 molily
Hallo,
ich hab ein Problem bei der vertikal Ausrichtung mit IE 5.5.
folgende Seite wird unter diesem Browser nicht richtig dargestellt:
http//www.codersland.de/test.html.
Die Schrift wird einfach an den oberen Rand geklatscht. Wie erreiche ich das auch dieser Browser den Text vertikal zentriert ?
Gruß
Uwe
Tja..hab die Lösung gefunden.
Das Problem war der <H1>-Tag. Damit hab ich via CSS die Schrift eingestellt. Aber so wie es aussieht ignoriert IE dann das im TD-Tag vorkommende valign.
Ich hab das nun via <span>-Tag gemacht und jetzt tut auch der IE.
Gruß Uwe
Hallo, Uwe,
Das Problem war der <H1>-Tag. Damit hab ich via CSS die Schrift eingestellt. Aber so wie es aussieht ignoriert IE dann das im TD-Tag vorkommende valign.
Nein, das valign wird richtig angewendet - der freie Raum unter dem Text ist das margin-bottom des h1-Elements. Das h1-Element samt Außenabständen füllt die Zelle voll aus.
Ich hab das nun via <span>-Tag gemacht und jetzt tut auch der IE.
Wieso? Das ist nicht nötig, du kannst auch weiterhin deine Überschrift ihrer Bedeutung nach mit einem h1-Element auszeichnen. Auf die Außen- und Innenabstände hast du mit CSS vollste Kontrolle und auch der MSIE lässt sich zur Mitarbeit überreden.
Siehe mein anderes Posting... Es besteht keine Notwendigkeit, ein bedeutungs- und aussageloses Element zu verwenden, wenn h1 passt und über CSS entsprechend formatiert werden kann.
Grüße,
Mathias
Hallo, Uwe,
ich hab ein Problem bei der vertikal Ausrichtung mit IE 5.5.
<http//www.codersland.de/test.html>.
Die Schrift wird einfach an den oberen Rand geklatscht. Wie erreiche ich das auch dieser Browser den Text vertikal zentriert ?
Es liegt daran, dass der Internet Explorer einen unteren Abstand für das h1-Element annimmt. Diesen Abstand kannst du durch die CSS-Deklaration margin:0; für das h1-Element deaktivieren (http://selfhtml.teamone.de/css/eigenschaften/randabstand.htm).
Ich weiß nicht ganz, was du mit vertikal zentrieren meist, denn da (cell)padding für die Zelle und auch padding für das h1-Element abgeschaltet sind beziehungsweise nicht explizit angeschaltet sind, ist die Zelle so hoch, wie es die Zeilenhöhe des h1-Elements bedarf. Momentan sieht das so aus:
MSIE 6 (ohne margin:0 für h1):
<img src="http://home.t-online.de/home/dj5nu/fanhost/tabelle-msie.png" border="0" alt="">
Mozilla 1.3a:
<img src="http://home.t-online.de/home/dj5nu/fanhost/tabelle-moz.png" border="0" alt="">
Opera 7.01:
<img src="http://home.t-online.de/home/dj5nu/fanhost/tabelle-opera.png" border="0" alt="">
Falls du über und unter dem Text noch Abstände einfügen willst, solltest du der Tabellenzelle oder dem h1-Element padding verpassen (ab besten nur oben und unten, http://selfhtml.teamone.de/css/eigenschaften/innenabstand.htm).
Übrigens liegt in folgender Tabellenzeile ein Fehler:
<td valign="middle" height="5" background="images/fh_leftmiddle.gif"></td>
<td valign="middle" height="5" background="images/fh_middle.gif" align="center"><H1>HEADERTEXT</H1></td>
<td valign="middle" height="5" width="5" background="images/fh_rightmiddle.gif"></td>
</tr>
Das Attribut height="5" muss ersatzlos heraus, da diese Zeile immer höher als 5 Pixel sein wird. Die erste Zelle der Zeile (das erste aufgeführte td-Element) benötigt zwingend width="5".
Grüße,
Mathias