nicht angemeldet
Hallo,
ein schneller Test mit folgendem HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
div, p, table {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
}
td, th {
border: 1px solid green;
padding: 2px;
}
</style>
</head>
<body>
<h1>table-Element "in" p-Element</h1>
<div style="border: 2px solid blue;">
<p style="border: 2px solid black; margin-left: 20px;">
Testcase
<table style="border: 2px solid red; width: 100%;">
<tr>
<th rowspan="2">Browser</th>
<th colspan="2">Anzeige</th>
</tr>
<tr>
<th>ohne Doctype-Angabe</th>
<th>mit Doctype-Angabe</th>
</tr>
<tr>
<td>Firefox 3</td>
<td>
table wird als Kind des p-Elementes dargestellt.
margin-left wirkt sich somit auch auf die Tabelle aus.
</td>
<td>
p-Element wird vor table geschlossen, table Kind des div-Element.
margin-left wirkt sich daher nicht mehr auf die Tabelle aus.
</td>
</tr>
<tr>
<td>IE 7</td>
<td colspan="2">
table wird in beiden Fällen als Kind des p-Elementes dargestellt.
margin-left sorgt in beiden Fällen für 20 Pixel Abstand zum Rand
des div-Elementes.
</td>
</tr>
</table>
Opera und Safari sind auf dem Rechner, vor dem ich gerade sitze,
nicht installiert.
</p>
</div>
</body>
</html>
Halten wir fest: Du kennst weder Firefox (3.0.1) noch Safari (3.1.1) noch Opera (9.52). Bei der Konstruktion <p><table></table></p> ist nämlich im generierten DOM-Baum in allen drei Browsern keine Tabelle im Absatz.
Firefox 3.0.1 unterscheidet aufgrund der Doctype-Angabe, wie die Darstellung aussieht. Ohne Doctype befindet sich die Tabelle im p-Element.
Zum Nachvollziehen:
Mit Doctype-Angabe: http://vinzenzmai.vi.funpic.de/tmp/test/table_in_p_mit_doctype.html
Ohne Doctype-Angabe: http://vinzenzmai.vi.funpic.de/tmp/test/table_in_p_ohne_doctype.html
Freundliche Grüße
Vinzenz
Gunnar Bittersmann