nicht angemeldet
Sali
Ich habe ein riesiges Problem! Ich möchte ein Layout aufbauen, wo ein div Block ums gaze herum hat, dann über die ganze Länge (800px) einen titel. Unter dem Titel mit Float Left kommt die navigation, Links an die navi der Text bereich. Die Navi und der Textbereich sollen immer nach ganz unten gehen, egal ob man Browser vergrössert oder nicht! Ich habe dies mit 100% versucht, aber sobald der Text länger ist, als er Platz hat(habe ich mit overflow:auto; programmiert) zeigt er es einfach nicht an! Und ich weiss jetzt nicht mehr weiter! Zudem soll nicht der Browser, sondern nur die Boxen Navi und Text, fals nötig, einen Scrollbalken erstellen!
Quellcode:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Testing something</title>
<style type="text/css">
<!--
html {
height:100%;
}
body {
height:100%;
margin:0;
}
#test_table {
margin:auto;
height:100%;
width:800px;
border:0;
}
div {
}
.titel {
height:65px;
color:#FFFFFF;
}
.navi {
width:160px;
overflow:auto;
}
.hpdiv {
height:100%;
background-color:#FFFF00;
margin:0;
border:0;
background-position:center;
overflow:hidden;
}
.text{
overflow:auto;
}
.tdoverflow {
overflow:auto;
}
#table_navi {
width:240px;
overflow:auto;
}
#text {
overflow:
}
-->
</style>
</head>
<body>
<div class="hpdiv">
<table id="test_table" cellpadding="0" border="0" cellspacing="0" >
<tr height="65px">
<td colspan="2" bgcolor="#000022"><span class="titel">Titel</span>
</td>
</tr>
<tr>
<td valign="top" width="160" bgcolor="#00CC33" class="tdoverflow"><div class="navi"><p><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin:auto; overflow:auto; width:160px;" bordercolor="#111111" width="150px;">
<tr>
<td background="menu_data/zeile.jpg" height="20" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/news/news.htm" style="text-decoration: none">
<font color="#FFFFFF">News</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td background="menu_data/zeile.jpg" align="center" height="20"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/geschichte/geschichte.htm" style="text-decoration: none">
<font color="#FFFFFF">Geschichte</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td background="menu_data/zeile.jpg" align="center" height="20"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/unihockey/unihockey.htm" style="text-decoration: none">
<font color="#FFFFFF">Unihockey</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/termine/termine.htm" style="text-decoration: none">
<font color="#FFFFFF">Termine</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/vorstand/vorstand.htm" style="text-decoration: none">
<font color="#FFFFFF">Vorstand</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="cgi-bin/guestbook.php" style="text-decoration: none">
<font color="#FFFFFF">Gästebuch</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/bildergalerie/bildergalerie.htm" style="text-decoration: none">
<font color="#FFFFFF">Fotogalerie</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/links/links.htm" style="text-decoration: none">
<font color="#FFFFFF">Links</font></a></font></b></td>
</tr>
<tr>
<td height="20"> </td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/herren/herren.htm" style="text-decoration: none">
<font color="#FFFFFF">Herren</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/junioren_a/junioren_a.htm" style="text-decoration: none">
<font color="#FFFFFF">A Junioren</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" href="seiten/junioren_b/junioren_b.htm" style="text-decoration: none">
<font color="#FFFFFF">B Junioren</font></a></font></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<a style="text-decoration: none" target="main" href="seiten/junioren_c/junioren_c.htm">
<font face="Arial" size="2" color="#FFFFFF">C Junioren</font></a></b></td>
</tr>
<tr>
<td height="4"></td>
</tr>
<tr>
<td height="20" background="menu_data/zeile.jpg" align="center"><b>
<font face="Arial" size="2" color="#FFFFFF">
<a target="main" style="text-decoration: none" href="seiten/plausch/plausch.htm">
<font color="#FFFFFF">Unihockey-Plausch</font></a></font></b></td>
</tr>
</table></td>
<td bgcolor="#CC3300" class="tdoverflow" valign="top"><div id="text">
<p>Test<br />
<br />
blablabla</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
<p>blblbl</p>
</div></td>
</tr>
</table>
</div>
</body>
</html>