Guten Tag verehrte Gemeinde,
Ich bin am verzweifeln.
Der Background von #kopf und #kopf2 wird nach dem Minimieren des Browser-Fensters nicht mehr korrekt angezeigt.
Genauer beschrieben:
Man minimiert das Browserfenster (IE oder FF) auf eine Größe bei der ein Horizontaler Scrollbalken erscheint, nun scrollt mann mit dem Balken nach links um den rechten Browserinhalt zu lesen und siehe da: Background von #kopf und #kopf2 werden nicht angezeigt.
Ich hab auch schon Lösungsansätze (overflow: auto, etc.) hier aus dem Forum probiert, aber ohne Erfolg. Irgendwas ist an meinem CSS falsch.
Wer kann mir bei der Lösung dieses Problems behilflich sein?
Anmerkung: DIV #text soll fix bleiben.
Danke.
Hier mein Html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
<!--
body {
background: aliceblue;
margin: 0;
padding: 0;
}
#kopf {
background: silver;
color: #FFF;
height: 130px;
width: 100%;
position: fixed;
}
#kopf2 {
background: lightblue;
height: 2em;
width: 100%;
position: fixed;
}
#text {
border: 1px dashed #18377A;
margin: 50px 0px 0px 280px;
position: absolute;
width: 535px;
}
-->
</style>
</head>
<body>
<div id="kopf"></div>
<div id="kopf2"></div>
<div id="text">
<p>Sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat, duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</div>
</div>
</body>
</html>