nicht angemeldet
Hallo,
bin erneut auf ein Problem bzw. ein Verständnisproblem im Zusammenhang mit der CSS-Eigentschaft display gestossen:
Ich möchte eine Tabelle (<table>) mit css derart darstellen, dass diese die gesamte Breite und eine exakte/vorgegebene Höhe einnimmt.
Ich meine verstanden zu haben, dass <table> per Default die Display-Eigenschaft "table" bekommt. Warum die Tabelle bei dieser Eigenschaft nicht die gesamte Breite bekommt, ist mir leider noch unklar!?
Da ich die gleiche Darstellung erreichen möchte, wie (per default) beim div-element, habe ich für die Tabelle display auf "block" gestelt.
Im FF ist das Verhalten wie von mir gedacht, der IE zeigt leider die Tabelle nicht in der vorgegebenen Höhe und Breite an keine, es erscheinent auch keine Scrollbar.
Hier ein Beispiel-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test: Scrollbare Tabelle</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<style type="text/css">
html,body {
margin: 0;
padding: 0;
border: 0;
}
table.scrolltest {
height: 200px;
overflow: auto;
display: block;
background-color: yellow;
}
</style>
</head>
<body>
<h1>scrollbare Tabelle</h1>
<table class="scrolltest">
<tr>
<td>Eins</td>
<td>Eins</td>
</tr>
<tr>
<td>Test</td>
<td>Zwei</td>
</tr>
<tr>
<td>Drei</td>
<td>Drei</td>
</tr>
<tr>
<td>Vier</td>
<td>Vier</td>
</tr>
<tr>
<td>Eins</td>
<td>Eins</td>
</tr>
<tr>
<td>Zwei</td>
<td>Zwei</td>
</tr>
<tr>
<td>Drei</td>
<td>Drei</td>
</tr>
<tr>
<td>Vier</td>
<td>Vier</td>
</tr>
<tr>
<td>Eins</td>
<td>Eins</td>
</tr>
<tr>
<td>Zwei</td>
<td>Zwei</td>
</tr>
<tr>
<td>Drei</td>
<td>Drei</td>
</tr>
<tr>
<td>Vier</td>
<td>Vier</td>
</tr>
<tr>
<td>Eins</td>
<td>Eins</td>
</tr>
<tr>
<td>Zwei</td>
<td>Zwei</td>
</tr>
<tr>
<td>Drei</td>
<td>Drei</td>
</tr>
<tr>
<td>Vier</td>
<td>Vier</td>
</tr>
<tr>
<td>Eins</td>
<td>Eins</td>
</tr>
<tr>
<td>Zwei</td>
<td>Zwei</td>
</tr>
<tr>
<td>Drei</td>
<td>Drei</td>
</tr>
<tr>
<td>Vier</td>
<td>Vier</td>
</tr>
</table>
</body>
</html>
Handelt es sich um einen IE-Bug oder was mache ich falsch? Gibt es andere/bessere Lösungen oder Workarounds?
Viele Grüße
Daniel