Ik heb al flink zitten zoeken in deze site, maar kan geen oplossing vinden. Ik heb 4 div's gemaakt in een container. De eerste div moet in zijn geheel de gehele breedte beslaan.De tweede en de derde div moeten naast elkaar onder de eerste div komen. De derde div moet komen onder de tweede of de derde div, afhankelijk welke van de twee div's het lansgt worden. ( in de twee div komt het menu, in de derde div kom alleen tekst, en dat in meerdere pagina's) Kort omschreven moet het eruit zien als onderstaande.
container open
div1
div2, div3
div4
container sluiten
Als ik nu in Div drie veel tekst onder elkaar zet,loop de tekst door div drie heen, en loopt zelfs de container uit. Als je naar de kleurtjes kijkt die ik iedere div heb gegeven, gaat div 4 zelfs achter div3 beginnen. Ik hoop dat dit duidelijk is en dat er iemand een oplossing heeft, ik heb hier al twee dagen mee bezig.
CSS file
HTML file
container open
div1
div2, div3
div4
container sluiten
Als ik nu in Div drie veel tekst onder elkaar zet,loop de tekst door div drie heen, en loopt zelfs de container uit. Als je naar de kleurtjes kijkt die ik iedere div heb gegeven, gaat div 4 zelfs achter div3 beginnen. Ik hoop dat dit duidelijk is en dat er iemand een oplossing heeft, ik heb hier al twee dagen mee bezig.
CSS file
Code:
#container {
margin: auto;
width: 980px;
height: auto;
border-color: #000000;
border: 2px solid;
}
#d1 {
background-color:red;
width: 960px;
}
#d2 {
background-color: #CCCC00;
width: 200px;
}
#d3 {
background-color: #FF0099;
width: 450px;
}
#d4 {
background-color: green;
width: 960px;
}
#d2, #d3 {
float: left
}
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="pagina.css" type="text/css" media="screen" />
<style type="text/css">
<!--
.style1 {font-size: 8pt}
-->
</style>
</head>
<body>
<div id="container">
<div id="d1">div 1</div>
<div id="d2">div 2<br>div 2</div>
<div id="d3">div 3<br>div 3<br>div 3<br>div 3<br>div 3<br>div 3<br>div 3<br>div 3<br>div 3</div>
<div id="d4">div 4<br>div 4<br>div 4<br>div 4<br>div 4</div>
</div>
</body>
</html>
Laatst bewerkt door een moderator:
