✔ [XHTML] Tabelle 100% und Zeile 50px hoch

[DoRiMaN]

Hallo an alle!

Ich möchte gerne eine Tabelle mit 100% Breite und Höhe erstellen. Nach langem probieren und suchen habe ich endlich eine Lösung im Internet gefunden, damit die Tabelle in allen Browsern mit 100% Höhe angezeigt wird, und trotzdem noch nach XHTML gültig ist.

Das sieht dann so aus:

CSS:

<style type="text/css">
	body {
		color:#000000; 
		background-color: #FFFFFF;
		font-size: 12px;
		font-family: Arial, Helvetica, sans-serif;
	}
	html, body, #tabelle {
		height: 100%;
		margin: 0;
		padding: 0;
		border: none;
	}
	#tabelle {
		background-color: #cccccc;
		margin: 0 auto;
		text-align: left;
		vertical-align: middle;
		width: 100%;
	}
</style>

und die Tabelle sieht dann so aus:

<table id="tabelle" border="1">
	<tr style="height: 50px;">
		<td colspan="3">50px height?!</td>
	</tr>
	<tr>
		<td style="width: 50px">&nbsp;</td>
		<td><a href="http://validator.w3.org/check?uri=referer">check page</a></td>
		<td style="width: 50px">&nbsp;</td>
	</tr>
	<tr style="height: 50px;">
		<td colspan="3">50 px height?!</td>
	</tr>
</table>

nun, das mit der 100% Höhe funktioniert problemlos. Was hingegen nicht (oder nich ganz) funktioniert, sind die 50px Höhe für die oberste und unterste Zeile.
Firefox zeigt dies korrekt an, Internet Explorer jedoch scheint dies (style="height: 50px;") komplett zu ignorieren, und die Zeilenhöhe wird einfach auf die ganze Seite aufgeteilt (in diesem Fall 1/3 der Seitenhöhe).

Kennt jemand dieses Problem und auch eine Lösung dazu?

Ich danke im Voraus!

Greetz

DoRiMaN

 

[Maik]

Das von dir beschriebene Problem im IE ist bekannt und wurde hier im Board auch schon desöfteren thematisiert, leider ohne nennenswerten Erfolg.

 

[DoRiMaN]

d'oh, sorry, hatte nichts gefunden hier

Hmm, und wie umgeht man es am besten?

 

[Maik]

Vielleicht ein tabellenloses CSS-Layout stricken?

 

[DoRiMaN]

*angst*

die Sache ist ein bisschen kompliziert

Aber dann werde ich wohl ein bisschen basteln müssen

Danke für die Antwort!