Hallo,
Ik ben bezig met een template voor een website, alles gaat goed, maar ik zit nu met een probleem:
Ik heb een div gemaakt waarin weer 3 div's verwerkt zitten. De linker div is de enige die niet in positie is gebracht door absolute position in een relative div, dus gewoon een normale div. Ik heb de min-height hiervan 760px gemaakt zodat i.i.g de plaatjes aan de rechterkant in de template passen.
Hoe kan ik ervoor zorgen dat de layout zich aanpast als de tekst hoogte groter is dan 760px?
Dit is de link naar de template: Verwijderd, opgelost.
Voor de duidelijkheid:
- De 3 div's zitten samen in 1 grote div dit is de #content div.
- De linker div is #amenu en heeft een min-height van 760px
- De midden div is de #centerbox, hier komt de tekst.
- De rechter div is de #bmenu, hier staan de plaatjes.
De code:
Ik ben bezig met een template voor een website, alles gaat goed, maar ik zit nu met een probleem:
Ik heb een div gemaakt waarin weer 3 div's verwerkt zitten. De linker div is de enige die niet in positie is gebracht door absolute position in een relative div, dus gewoon een normale div. Ik heb de min-height hiervan 760px gemaakt zodat i.i.g de plaatjes aan de rechterkant in de template passen.
Hoe kan ik ervoor zorgen dat de layout zich aanpast als de tekst hoogte groter is dan 760px?
Dit is de link naar de template: Verwijderd, opgelost.
Voor de duidelijkheid:
- De 3 div's zitten samen in 1 grote div dit is de #content div.
- De linker div is #amenu en heeft een min-height van 760px
- De midden div is de #centerbox, hier komt de tekst.
- De rechter div is de #bmenu, hier staan de plaatjes.
De code:
Code:
#content {
background-color: #f9f9f9;
position:relative;
border: 1px solid #cccccc;
width: 880px;
margin: 0px auto;
}
#amenu {
background-color: #efefef;
background-repeat: repeat-x;
border-right: 1px solid #e1e1e1;
min-height: 760px;
width: 160px;
}
#centerbox {
background-color: #f9f9f9;
width: 514px;
position:absolute;
top:0;
left:163px;
padding-left: 5px;
padding-right: 5px;
}
#bmenu {
background-color: #efefef;
background-repeat: repeat-x;
width: 190px;
position:absolute;
border-left: 1px solid #e1e1e1;
top:0;
right:0;
}
Laatst bewerkt:
