Uwe Rupprecht: Problem mit Ausrichtung bei IE 5.5

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

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

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

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