H
HendrickM
Hallo.
Ich bekomme es einfach nicht hin, dass 2 oder mehrere Divs, welche sich in einem übergeordnetem Div befinden, bündig miteinander abschließen, wenn der Inhalt eines Divs länger ist als der andere.
Die "Nav" ist kürzer als der "content", ich würde aber gerne beide immer gleichlang haben da im content
ein dynamischer Inhalt generiert wird.
Desweiteren verkürzt sich die "site" auf 100px, aber warum?
"site" beinhaltet doch Divs, welche länger als 100px sind, also müsste er diese doch umschließen******
Könnt Ihr mir da weiter helfen?
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title></title>
<style type="text/css">
body, html
{
height: 100%;
margin: 0px;
padding: 0px;
}
div#site
{
background-color:Green;
width: 800px;
height:auto; /* Warum setzt sich hier die Height automatisch auf 100px? Müsste Sie sich nicht anpassen an die längste Div (z.B. header2)?*/
margin:auto;
}
div#header1
{
background-color:Fuchsia;
height: 100px;
width: 700px;
}
div#main
{
background-color:yellow;
height: auto;
width: 700px;
float:left;
}
div#header2
{
background-color:Fuchsia;
width: 100px;
height:400px;
float:left;
}
div#nav
{
background-color:Gray;
width: 100px;
height:auto;
float:left;
}
div#content
{
background-color:Red;
width: 600px;
height:auto;
float:left;
}
</style>
</head>
<body>
<div id="site">
<div id="header1">header1</div>
<div id="main">
<div id="nav">nav</div>
<div id="content">content<br>content<br>content<br>content<br></div>
</div>
<div id="header2">header2</div>
</div>
Ich bekomme es einfach nicht hin, dass 2 oder mehrere Divs, welche sich in einem übergeordnetem Div befinden, bündig miteinander abschließen, wenn der Inhalt eines Divs länger ist als der andere.
Die "Nav" ist kürzer als der "content", ich würde aber gerne beide immer gleichlang haben da im content
ein dynamischer Inhalt generiert wird.
Desweiteren verkürzt sich die "site" auf 100px, aber warum?
"site" beinhaltet doch Divs, welche länger als 100px sind, also müsste er diese doch umschließen******
Könnt Ihr mir da weiter helfen?
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title></title>
<style type="text/css">
body, html
{
height: 100%;
margin: 0px;
padding: 0px;
}
div#site
{
background-color:Green;
width: 800px;
height:auto; /* Warum setzt sich hier die Height automatisch auf 100px? Müsste Sie sich nicht anpassen an die längste Div (z.B. header2)?*/
margin:auto;
}
div#header1
{
background-color:Fuchsia;
height: 100px;
width: 700px;
}
div#main
{
background-color:yellow;
height: auto;
width: 700px;
float:left;
}
div#header2
{
background-color:Fuchsia;
width: 100px;
height:400px;
float:left;
}
div#nav
{
background-color:Gray;
width: 100px;
height:auto;
float:left;
}
div#content
{
background-color:Red;
width: 600px;
height:auto;
float:left;
}
</style>
</head>
<body>
<div id="site">
<div id="header1">header1</div>
<div id="main">
<div id="nav">nav</div>
<div id="content">content<br>content<br>content<br>content<br></div>
</div>
<div id="header2">header2</div>
</div>