Bis jetzt ist meine Navigation (also die DIV "Darunter") so groß, wie der Inhalt. Wie aber kann ich diese so groß "aufziehen", dass sie bis zum unteren Rand der DIV "Seite" reicht?
html,body {height:100%}
mfg Beat
Hab ich gemacht, ändert aber nichts!
Hier mein Code
index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Startseite</title>
<!-- META-Daten -->
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<!-- Styles -->
<link rel="stylesheet" media="screen" type="text/css" href="darstellung.css">
</head>
<body >
<!-- Kopf -->
<div id="kopf">
<img src="grafiken/logo.gif" width="180" height="135" alt="Unser Logo" id="logo" >
<h1 id="titel">Startseite</h1>
</div>
<!-- Kopf Ende -->
<!-- "Zweite Zeile" -->
<div id="darunter">
<div id="navigation">
<h2>Navigation</h2>
<ul id="navi">
<li class="nav">Navi1</li>
<li>Navi2</li>
</ul>
</div>
<div id="Inhalt">
</div>
</div>
<!-- Ende "Zweite Zeile" -->
<div id="fuss">
© Fireball
</div>
</body>
</html>
dastellung.css
html {
color: black; background-color: #C0C0C0;
font-size: 105%;
font-family: Arial,Helvetica,sans-serif;
height: 98%;
text-align: center; /* Zentrierung im Internet Explorer */
}
body {
text-align: left;/* Seiteninhalt wieder links ausrichten */
margin: 1% auto;/* standardkonforme horizontale Zentrierung */
width: 95%;
height: 95.2%;
padding: 0px;
background-color: #ffffff ;
border: 2px ridge black;
overflow: auto;
}
#kopf {
background-color: #FFFF00;
height: 135px;
}
#logo {
margin: 0 0;
float:left;
}
h1#titel {
position:relative;
top:0.6em;
left:0px;
padding-top:0em;
margin: 0 0;
text-align:center;
font-family: 'Courier New', monospace;
font-weight:normal;
}
div#navigation {
position:relative;
top: 0px;
bottom: 0px;
left:0px;
text-align:justify;
background-color:#C0C0C0;
height: 100ex;
padding: 10px;
margin-top: 5px;
margin-bottom: 5px;
margin-left: 3px;
margin-right: 3px;
width: 157px;
color: #000000;
}
ul#navi {
list-style-type:none;
padding: 10px;
margin-top: 5px;
margin-bottom: 5px;
margin-left: 3px;
margin-right: 3px;
width: 140px;
color: #000000;
}
.nav:hover {
background-color:#FFFF00;
}
div#fuss {
background-color: #FFFFFF;
font-size: 67%;
width:93.5%;
text-align: center;
border: 1px dashed black;
position:absolute;
bottom:4%;
}
strong {
font-weight:bold;
}
li#nav {
color: #000000;
}
a#nav {
text-decoration: none;
color: #000000;
}
.abs-ocss {
visibility:hidden;
}
Und so soll es aussehen:
http://www.imgbox.de/?img=m23636x122.png
Vielen Dank für Eure bisherige Mühe und auch schon mal 'Danke' im Vorraus!
Fireball