Tabelle soll ganzen Bildschirm füllen

xenesis

Hallo,
ich hab folgende HTML-Datei:

HTML

<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>OS Forum - Hauptseite</title></head>
<body>
<table width="100%" height="100%" border="1">
<tr><td height="50%">EINS</td></tr>
<tr><td height="50%">ZWEI</td></tr>
</table>
</body>
</html>

Alles anzeigen

Die Tabelle sollte eigentlich den ganzen Bildschirm ausfüllen.
Tut sie aber nicht. :?
Naja zugegeben <table height="100%"> ist auch kein gültiges XHTML, aber was tun damit's funktioniert?

DeckMan

Ich weiß zwar nicht, ob das auch bei XHTML funktioniert, aber ich hab's bei mir per CSS realisiert.

Code

<style type="text/css">
table { height: 100%; width: 100%; }
</style>

bugcatcher

In XHTML wird das mit prozentual angegeben höhen ein Krampf. Nur so als Hinweis. Und Firefox/Gecko nimmt DocType-Angaben ernst (im gegensatz zum IE, der sich dafür quasi garnicht interessiert). Bei XHTML sind die default-Werte für die Elemente anders. Und vor allem nie height:100%;

Um also in XHTML eine 100%-Höhe zu bekommen müssen sowohl html als auch body 100% höhe zugewiesen bekommen, damit man einen table an diesem ausrichten kann. ist der body schon keine 100% hoch, kann sich auch der table nicht zu 100% ausdehnen.

Code

<style type="text/css">
html, body { height: 100%; width: 100%; }
table.haupttabelle { height: 100%; width: 100%; }
</style>

Aber nicht vergessen! IE und Firefox benutzen ein unterschiedliches Boxmodell. Du solltest XHTML strict verwenden, damit IE das richtige w3c-boxmodell nimmt.