Shadowcrow: warum wird in den header gescrollt?

Beitrag lesen

hi $name,

ich dilettiere gerade an einem webseiten entwurf rum ;-) und da ich ja lernfähig bin, ohne tabellen.
nur: der content text (dummy lorem ipsun) läuft unter dem header durch beim scrollen.
http://public.reels4actors.de/michel/michel2.php

das schlimmste ist, ich habe das gefühl ich müsste die lösung kennen, ich komm nur nicht drauf :-)
und äh wenn ich schon dabei bin: das sind doch nicht zu viele divs? will ja nicht pest durch cholera ersetzen.

hier jetzt die relevanten indizien meines verbrechens:
*************HTML***************
<!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=utf-8" />
      <link rel="stylesheet" href="style_sheets/main.css" type="text/css" media="screen" />
 <title>| blablub |</title>
</head>
<body>
<div id="header">
<img src="pics/logo.png" alt="" width="279" height="70" class="fllft" /><ul id="Navigation">
<li><a href="#" target="_self">Projekte</a></li>
<li><a href="#" target="_self">Vita</a></li>
<li><a href="#" target="_self">Referenzen</a></li>
<li><a href="#" target="_self">Kontakt</a></li>
</ul>
</div>
<div id="cont_main">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, cril delenit augue duis dolore te feugait nulla facilisi.
[SNIP]
</div>
<div id="footer"><img src="pics/logo2.png" alt="" width="279" height="70" /></div>
</body>
</html>
*************CSS***************
body {
padding:0;
color:#000;
font-family : Courier New, Courier, mono;
background-image: url(../pics/bg.gif);
background-color: #000;
}

#header {
 position:fixed;
 width:600px;
 height:70px;
 z-index:1;
 left: 120px;
 top: 20px;
 padding: 0;
}
#cont_main {
 border: 1px solid red;
 position:absolute;
 margin: 130px 5px 50px 10px;
 padding: 0 20px 20px 10px;
 width:475px;
 height:auto;
 z-index:2;
 left:377px;
 top: 0px;
}
#footer {
 position:fixed;
 width:280px;
 height:auto;
 z-index:3;
 left: 860px;
 bottom: 20px;
}
.fllft {float:left;}
/************************************************************** */

bleibt mir gewogen: eure übelkrähe ;-)

gruss
shadow

--
Programmers don´t die, they GOSUB without RETURN.
Quelle: unbekannt