magnetschieber: height:100% und umschlossener Content-Div-Container

Beitrag lesen

SELF-Forum

height:100% und umschlossener Content-Div-Container

magnetschieber
– Informationen zu den Bewertungsregeln

Liebe Forenuser,

ich stehe gerade vor folgendem Problem: Eine Webseite soll jeweils eine Höhe von 100% haben, bei einem längeren Text im Contentbereich sich jedoch diesem anpassen.

Mein Code führt zu einer Webseite, die mit einer Höhe von 100% korrekt dargestellt wird, jedoch ein längerer Text (div:text) überschreitet den umschließenden Container (div:content).

Der Hintergrund für diese Verschachtelung: div:content definiert eine Hintergrundfarbe, die sich vom restlichen Hintergrund unterscheidet.

  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">  
<link rel="stylesheet" type="text/css" href="style.css">  
<title>Insert title here</title>  
</head>  
<body>  
  
<div id="content">  
	<div id="text"></div>  
	<div id="logo"></div>  
	<div id="header"></div>  
        <div id="nav"></div>  
</div>  
</body>  
</html>  


  
@CHARSET "ISO-8859-1";  
  
html {  
	height:100%;  
	width:100%;  
}  
  
body {  
	background-color:#282829;  
	margin:0;  
	padding:0;  
	height:100%;  
	width:100%;  
}  
  
div#content {  
	position:absolute;  
	left:25px;  
	top:0px;  
	background-color:#FFFFFF;  
	z-index:-15;  
	width:900px;  
	min-height:100%;  
	height:auto;  
}  
  
div#head {  
	position:absolute;  
	top:0px;  
	left:0px;  
	width:900px;  
	height:50px;  
	z-index:15;  
	background-color:#282829;  
}  
  
div#logo {  
	position:absolute;  
	top:50px;  
	left:25px;  
	z-index:5;  
}  
  
div#nav {  
	position:absolute;  
	top:130px;  
	left:25px;  
	z-index:10;  
	font-family:Verdana,Arial,sans-serif;  
	font-size:12pt;  
	color:#282829;  
	text-decoration:none;  
	width:175px;  
}  
  
div#text {  
	position:absolute;  
	top:325px;  
	left:250px;  
	width:375px;  
	height:100%;  
}

Ich ahne, dass es eine kleine Unachtsamkeit beim Erstellen war, finde jedoch den Fehler nicht.

In der Hoffnung auf hilfreiche Kommentare,
magnetschieber

Beitrag melden
–
Informationen zu den Bewertungsregeln