nicht angemeldet
Hallo zusammen,
ich habe ein kleines Problem mit einem CSS-Design.
hier der Quelltext:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>
Test
</title>
<style type="text/css">
#site {
max-width:1000px;
min-width:500px;
margin: auto;
padding-top:20px;
background-color: #FFFFFF;
}
#header {
position:relative;
background-color: #EEEEEE;
height: 200px;
z-index:1;
}
#content {
position:relative;
width:90%;
left:5%;
top:-220px;
padding-top:220px;
background-color: #AAAAAA;
border: 3px solid #FF0000;
z-index:0;
}
#footer {
position:relative;
top:-210px;
max-width:1000px;
min-width:500px;
margin: auto;
clear: both;
text-align: center;
color: #CCCCCC;
font-size:0.8em;
}
</style>
</head>
<body>
<div id="site">
<div id="header"><a href="/"><ipg src="header.png" alt="header" /></a></div>
<div id="content">
<p>Lorem ipsum dolor sit amet consectetuer dolor eros tempor Praesent ac. Quis ac sem Aliquam penatibus neque sed fringilla Aliquam nec nec. Nec dui pellentesque iaculis accumsan vitae Curabitur Nullam tellus enim rutrum. Orci tempus consequat convallis sed Aliquam tincidunt nec lorem Integer Aenean. Ut Donec metus enim eget ac et tincidunt lobortis.</p>
</div>
<div id="footer">Bla bla bla, Impressum und so</div>
</div>
</body>
</html>
Mein Problem ist, dass wenn der Inhalt (content) länger wird immer ein unschöner weißer Bereich am Ende der Seite entsteht, der zu einer Scrollleiste führt, obwohl überhauptnichts zu scrollen ist.
Ich hab mich jetzt etwas "festgefahren" und suche ein paar Ideen.
Gruß
Sebastian
Gunnar Bittersmann