Tabellenhöhe passt sich falsch an
Bernd Themann
- html
0 Maz
Guten Tag,
ich bin gerade dabei eine neue Homepage zu machen (http://berndthemann.de/neu/) hab aber noch ein kleiens Problem mit der Tabellen höhe, ich möchte, dass das Menü seine festegelegt höhe bei behält und sich nur die Reihe unter dem Menü ausdehnt (falls der Inhalt länger wird)
hier nochmal der Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">;
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body style="background-image:url(grafik/layout_background.gif);">
<table width="700" height="10" align="center" cellpadding="0" cellspacing="0" bgcolor="#5E5E5E">
<tr>
<td style="background-image:url(grafik/layout_topbar.gif); background-repeat:repeat-x" height="10" colspan="7"> </td>
</tr>
<tr>
<td style="background-image:url(grafik/layout_head_background.gif); background-repeat:repeat-x" height="83" colspan="7"><img src="grafik/layout_logo.jpg" width="265" height="83"></td>
</tr>
<tr>
<td style="background-image:url(grafik/layout_bottombar.gif); background-repeat:repeat-x" height="10" colspan="7"> </td>
</tr>
<tr>
<td colspan="2" bgcolor="#7B7A7A" valign="top"><img src="grafik/menu_oben.gif" width="181" height="3"></td>
<td width="13"><img src="grafik/menu_ecke_oben.gif" width="13" height="10"></td>
<td width="5" rowspan="7"></td>
<td valign="top" align="left" bgcolor="#747474"><img src="grafik/frame_ecke_links_oben.gif" width="10" height="10"></td>
<td width="496" valign="top" bgcolor="#747474"><img src="grafik/frame_oben.gif" width="498" height="10"></td>
<td align="right"><img src="grafik/frame_ecke_rechts_oben.gif" height="10"></td>
</tr>
<tr height="51">
<td width="153"><a href="#"><img src="grafik/buttons/links.gif" width="153" height="51" border="0" onMouseOver="document.images['button_1'].src='grafik/button_hover.gif';" onMouseOut="document.images['button_1'].src='grafik/button.gif';"></a></td>
<td width="28"><img src="grafik/button.gif" width="28" height="51" name="button_1"></td>
<td bgcolor="#7B7A7A" rowspan="5" align="right"><img src="grafik/menu_right.gif" width="3" height="255"></td>
<td width="8" rowspan="7" style=" background-image:url(grafik/frame_links.gif); background-repeat:repeat-y;" bgColor="#747474"></td>
<td rowspan="7" bgcolor="#747474"><p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
<td width="8" rowspan="7" style=" background-image:url(grafik/frame_rechts.gif); background-repeat:repeat-y;" bgColor="#747474"> </td>
</tr>
<tr height="51">
<td width="153"><a href="#"><img src="grafik/buttons/privat.gif" width="153" height="51" border="0" onMouseOver="document.images['button_2'].src='grafik/button_hover.gif';" onMouseOut="document.images['button_2'].src='grafik/button.gif';"></a></td>
<td width="28"><img src="grafik/button.gif" name="button_2" width="28" height="51" id="button_2"></td>
<td width="8"> </td>
</tr>
<tr height="51">
<td width="153"><a href="#"><img src="grafik/buttons/schule.gif" width="153" height="51" border="0" onMouseOver="document.images['button_3'].src='grafik/button_hover.gif';" onMouseOut="document.images['button_3'].src='grafik/button.gif';"></a></td>
<td width="28"><img src="grafik/button.gif" name="button_3" width="28" height="51" id="button_3"></td>
<td width="8"> </td>
</tr>
<tr height="51">
<td width="153"><a href="#"><img src="grafik/buttons/medien.gif" width="153" height="51" border="0" onMouseOver="document.images['button_4'].src='grafik/button_hover.gif';" onMouseOut="document.images['button_4'].src='grafik/button.gif';"></a></td>
<td width="28"><img src="grafik/button.gif" width="28" height="51" name="button_4"></td>
<td width="8"> </td>
</tr>
<tr height="51">
<td width="153"><a href="#"><img src="grafik/buttons/sonstiges.gif" width="153" height="51" border="0" onMouseOver="document.images['button_5'].src='grafik/button_hover.gif';" onMouseOut="document.images['button_5'].src='grafik/button.gif';"></a></td>
<td width="28"><img src="grafik/button.gif" name="button_5" width="28" height="51" id="button_5"></td>
<td width="8"> </td>
</tr>
<tr height="10">
<td colspan="2" align="right" valign="bottom" bgcolor="#7B7A7A" height="10"><img src="grafik/menu_unten.gif" width="181" height="3"></td>
<td><img src="grafik/menu_ecke.gif" width="13" height="10"></td>
</tr>
<tr>
<td colspan="4"> </td>
<td></td>
</tr>
<tr>
<td colspan="4"></td>
<td valign="bottom"><img src="grafik/frame_ecke_links_unten.gif" width="10" height="10"></td>
<td valign="bottom"><img src="grafik/frame_unten.gif" width="498" height="10"></td>
<td valign="top" align="left"><img src="grafik/frame_ecke_rechts_unten.gif" width="8" height="10"></td>
</tr>
</table>
</body>
</html>
was ist zu tun? Im Firefox wird es richtig dargestellt
MFG: berndthemann
Moinsen,
<tr height="51">
das geht ja auch nicht. Der IE macht das zwar, aber es nicht valide.
Schau mal hier was über height definiert ist:
http://www.css4you.de/height.html Das gilt u.a. für TabellenSPALTEN nicht für -Zeilen.
Hier gibts übrigens prima Templates für Tabellenloses Layouts
http://www.css4you.de/wslayout1/index.html
und
http://intensivstation.ch/css/template.php
und zum selber entwerfen
http://www.csscreator.com/version2/pagelayout.php
und für schicke Menus in CSS siehe auch hier:
http://www.stunicholls.myby.co.uk/menus/index.html