HTML Table height 100%

Cheesefish · 16. Juli 2008

Hallo Zusammen

Ich hab hier mal n kleines problem und weiss einfach nicht weiter.

Hier mal der Quelltext

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style>
*{
margin:0px;
padding:0px;
}
html,body{
height:100%;
}

</style>
</head>

<body>
<table cellpadding="0" cellspacing="0" height="100%" width="100%" border="0">
<tr>
<td style="background-color:red;" height="50px"> </td>
</tr>
<tr>
<td style="background-color:black;" height="100%"> </td>
</tr>
<tr>
<td style="background-color:green;" height="50px"> </td>
</tr>
</table>

</body>
</html>

Im Firefox funktioniert alles tip top.
Im Internet Explorer kann man ca 3cm nach unten scrollen.

Entfernt man folgende Zeile:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Funktioniert es wieder. Dafür andere Elemente im Firefox 2.0 falsch angezeigt.

Wer kann mir helfen?

MfG Cheesefish

PW-toXic · 16. Juli 2008

Dein Code macht logisch gesehn keinen Sinn:
Du hast ein Element mit der Höhe 100%. (die table selbst)

darin sind 3 elemente unteinander, welche 3 verschiedene höhen haben:
50px; 100% und 50px
die Höhe vom INHALT der table ist also 100% PLUS 2 * 50px groß.

Warum wird das ganze nun falsch angezeigt? Weil der Internet Explorer doof ist

Beim Internet Explorer beduetet"height: 50px" genau genommen "min-height: 50px" was einfach falsch ist. Da der Inhalt von der table nun größer ist, als die table selbst (100% vs 100%+100px) wird die table ansich selbst größer also 100% der höhe des Bildschirms gemacht, und schon musst du scrollen

All diese Probleme hättest du aber nicht, wenn du die tables so anwenden würdest, wie sich das gehört.
Das was du gerade machst ist sicherlich NICHT der sinn und Zweck von tabellen.
Sag mal lieber, was du haben möchtest, und evtl. fällt mir dann eine bessere Lösung ein.
height=100% ist allerdings immer eine problematische sache.

Cheesefish · 16. Juli 2008

hmm die lösung ist....

das <html> tag fehlt-.-

Suche

HTML Table height 100%

Cheesefish

Ensign

PW-toXic

Lieutenant

Cheesefish

Ensign

Ähnliche Themen