HTML-Trompete: Vertical-align und DOCTYPE

Hallo zusammen,

eigentlich habe ich ein ganz simples Problem. Ich möchte einen Text mittig zentriert (horizontal und vertikal) ausrichten. Dazu habe ich eine Tabelle erstellt und wollte den Text via CSS entsprechend ausrichten.
Leider funktioniert das "vertical-align: middle;" nicht richtig, solange ein DOCTYPE angegeben ist. Entferne ich den DOCTYPE, wird es richtig dargestellt. Könnt ihr mir helfen?

Vielen Dank schonmal.
Anbei die Codes für euch.

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type">  
<meta http-equiv="content-style-type" content="text/css">  
</head>  
  
<body>  
<table>  
  <tr>  
    <td>  
        <p>Text</p>  
    </td>  
  </tr>  
</table>  
</body>  
</html>  

  
@charset "ISO-8859-1";  
  
table, td {  
	height: 100%;  
	width: 100%;  
	border: 0;  
	vertical-align: middle;  
}  

  1. Hi,

    eigentlich habe ich ein ganz simples Problem. Ich möchte einen Text mittig zentriert (horizontal und vertikal) ausrichten. Dazu habe ich eine Tabelle erstellt

    HTML-Code solltest du nicht abhängig von der gewünschten Darstellung wählen, sondern so, dass er die Inhalte in ihrer Struktur bestmöglich auszeichnet.

    Du hast keine tabellarischen Daten, also stopfst du sie auch nicht in eine Tabelle.

    Leider funktioniert das "vertical-align: middle;" nicht richtig, solange ein DOCTYPE angegeben ist. Entferne ich den DOCTYPE, wird es richtig dargestellt. Könnt ihr mir helfen?

    Ohne Doctype gehen die Browser in den sog. Quirks Mode, um von dir gemachte Fehler auszubügeln.

    Könnt ihr mir helfen?

    </hilfe/faq.htm#css-zentrieren>
    http://www.google.com/search?q=vertical+centering+css

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
  2. Hallo,

    im standardkonformen Modus ist body nur so hoch, wie der Inhalt es minimal erfordert. Daher füllt die Tabelle nicht den Viewport aus. Wenn du body ebenfalls height: 100% gibst und margin/padding auf 0 setzt, so füllt die Tabelle das Browserfenster aus und der Text ist zentriert.

    Mathias