[CSS] div's mee laten rekken
Ik zit even met een CSS probleempje, hoop dat jullie kunnen helpen. Het is een veel voorkomend probleem, maar toch kom ik er niet echt uit.
Ik heb twee div's naast elkaar staan. Deze zijn met een float naast elkaar gezet. Nu wil ik dat als de rechterdiv gevuld wordt met text, automatisch de linkerdiv ook meeschaald. Iemand een idee hoe ik dit moet aanpakken?
css:
Code (php)
1
2
3
4
5
6
2
3
4
5
6
#pageContainer
{
width:80%;
margin-left:5%;
padding-top:15px;
}
{
width:80%;
margin-left:5%;
padding-top:15px;
}
het gedeelte waar ik het over heb is het volgend:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<div style="height:auto;">
<div style="height:auto;">
<div id="leftContainer">
<div id="leftContent">
</div>
</div>
</div>
<div style="height:auto;">
<div id="leftContainer">
<div id="leftContent">
</div>
</div>
</div>
de css hiervan is:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#leftContainer
{
width:20%;
float:left;
background-image:url(../images/siteimages/shadow2.png);
background-repeat:repeat-y;
background-position:right 458px;
height:100%;
}
#leftContainer #leftContent
{
height:458px;
background-image:url(../images/siteimages/leftback.png);
background-repeat:no-repeat;
background-position:top right;
}
{
width:20%;
float:left;
background-image:url(../images/siteimages/shadow2.png);
background-repeat:repeat-y;
background-position:right 458px;
height:100%;
}
#leftContainer #leftContent
{
height:458px;
background-image:url(../images/siteimages/leftback.png);
background-repeat:no-repeat;
background-position:top right;
}
Kan het iets te maken hebben met de hoogte van de #leftContent?
