Höhe bestimmter Tabellenelemte festlegen

nero-15

Hi,
ich bin auf folgendes IE Problem gestoßen und hoffe es mit eurer Hilfe irgendwie umgehen zu können. Ich möchte eine Tabelle erstellen, die 4 Zellen hat und wie folgt aussieht:

Code

<table border="1">
<tr>
<td style="height:20px; width:150px;">Joasd</td><td style="width:500px; height:300px;" rowspan="3">Joasdasd</td>
</tr>
<tr>
<td height="20px" style="height:20px; width:150px;">asdasdasd</td>
</tr>
<tr style="">
<td>asdasdasd</td>
</tr>
</table>

Alles anzeigen

Die beiden Zellen linksoben und linksmitte sollen jeweils eine difinierte Höhe haben, wobei sich die Zelle linksunten an die Höhe von der rechten Zelle anpassen soll. Mit Firefox funktioniert es so. Nur mit dem IE hab ich probleme.
Vielen Dank

Ronald

Moin!

Ich vermute du machst den gleichen Fehler wie fast alle, die Tabellenprobleme haben -> falsche Dokumententyp-Angabe.

Zeig mal bitte den kompletten Quelltext.

G.a.d.M.

Ronald

nero-15

Also ich hab folgenden Quelltext:

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<table border="1" style="">
<tr>
<td style="height:20px; width:150px;">Joasd</td><td style="width:500px; height:300px;" rowspan="3">Joasdasd</td>
</tr>
<tr>
<td height="20px" style="height:20px; width:150px;">asdasdasd</td>
</tr>
<tr style="">
<td>asdasdasd</td>
</tr>
</table>
</body>
</html>

Alles anzeigen

Ronald

Moin!

Wenn du die Zeellenhöhen ohnehin in Pixel angibst, dann gibd doch auch die Höhe für die 3. Zelle links mit vor. Die Höhe steht ja fest und dannversteht es auch der IE (und der Firefox zeigt es dann richtig an, nicht nur ungefähr richrig):

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<table border="1" style="">
<tr>
<td style="height:20px; width:150px;">Joasd</td><td style="width:500px; height:300px;" rowspan="3">Joasdasd</td>
</tr>
<tr>
<td style="height:20px;">asdasdasd</td>
</tr>
<tr style="">
<td style="height:260px;">asdasdasd</td>
</tr>
</table>
</body>
</html>

Alles anzeigen

R.a.d.M.

Ronald

nero-15

Also mein Problem ist ja, dass ich die Höhe der rechten Zelle nicht weiß, da sie je nach Inhalt unterschiedlich groß ist. Ansonsten wäre das natülich eine gute Lösung. Die beiden oberen Zellen links sollen eine Navigation verkörpern und die rechte Zelle soll das Anzeigefenster darstellen. Ich finde es nur einfach komisch warum es nicht gehen sollte.

Ronald

Was hältst du von solch einer Lösung?:

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<table border="1">
<tr>
<td style="width:150px;" valign="top">
 <span style="display:block;height:20px;background-color:#DFDFDF;line-height:20px;">Joasd 1</span>
 <span style="display:block;height:20px;background-color:#D2FFDA;line-height:20px;">Joasd 2</span>
 </td>
 <td style="width:500px; height:300px;">Joasdasd</td>
</tr>
</table>
</body>
</html>

Alles anzeigen

G.a.d.M.

Ronald

nero-15

Ist auf jeden Fall eine gute Idee. Nur leider muss ich dann mein Design umstellen, weil es sich so nicht 100% umsetzen lässt. Ich werd es aber tun müssen, sonst fallen mich noch die ganzen IE Nutzer an.

Vielen Dank nochmal

Tags