Hallo,
Ich bin gerade dabei html/css zu erlernen. Dabei stoße ich gerade auf vollgendes Problem:
Ich habe einen container(contencontainer) der 2 weiter div-boxen und einen weitern container(content) mit 2 div-boxen(bread und inhalt) enthält. Ich habe die Boxen einfach mal mit Buchstaben gefüllt. Da es im späteren Template wahrscheinlich ist das die boxen nicht gemeinsam abschließen, soll der Hintergrund vom container(contentcontainer) angezeigt werden. Aber ich weis nicht warum der Container nicht mitwächst.
index.html:
template.css
Vielen Dank schoneinmal ;)
Ich bin gerade dabei html/css zu erlernen. Dabei stoße ich gerade auf vollgendes Problem:
Ich habe einen container(contencontainer) der 2 weiter div-boxen und einen weitern container(content) mit 2 div-boxen(bread und inhalt) enthält. Ich habe die Boxen einfach mal mit Buchstaben gefüllt. Da es im späteren Template wahrscheinlich ist das die boxen nicht gemeinsam abschließen, soll der Hintergrund vom container(contentcontainer) angezeigt werden. Aber ich weis nicht warum der Container nicht mitwächst.
index.html:
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"
xml:lang="" >
<head>
<link rel="stylesheet" href="css/template.css" type="text/css" />
</head>
<body id="bg">
<div id="container">
<div id="header">
</div>
<div id="banner">
</div>
<div id="topmenue">
</div>
<div id="contentcontainer">
<div id="left">asdasdasd
wejasdhkjasd kjkjasfdh akjasdjkd asdjkdjkasd asdjkasdjkgasd dkjasd dasdjkgasdkjggaskjd asdkjasdjkasdh asdkhasd asdjhasdk dkjasdhd
</div>
<div id="right">sdsfsdf
asdasd + ashd dhasgdhjgasd asdhgasdh dhgasdhjasd asdhgasdhjgd asdhgasdhjd asdhgasdjgd asdhgasdhjd asdhgaShdgas d
</div>
<div id="content">
<div id="bread">asdasdasdasdasdm,asd jsdksajdgh dashgkd asfddjhsdahjs dasjgdhjhsgd asdgasjh asd<br />
</div>
<div id="inhalt">asfdsdfsdf
sdf
asdfasd dgsdj asdfask djgasdfasg dfasdfasdgas dasdgfasgdfasd asgfdghasdf
</div>
</div><br/>
</div>
</div>
</body>
</html>
Code:
* {
margin:0px;
padding:0px;
}
#container {
width: 920px;
margin: auto;
background-color: #969;
}
#header {
background-color: #000;
height: 100px;
width: 920px;
}
#banner {
height: 250px;
width: 920px;
background-color: #0F0;
}
#topmenue {
height: 50px;
width: 920px;
background-color: #03F;
}
#contentcontainer {
width: 920px;
background-color: #666;
height: auto;
}
#left {
float: left;
height: auto;
width: 250px;
}
#right {
float: right;
height: auto;
width: 250px;
}
#inhalt {
height: auto;
width: 420px;
}
#bread {
height: auto;
width: 420px;
}
#content {
float: left;
width: 420px;
height: auto;
}Vielen Dank schoneinmal ;)
