Div linken aan andere div

kareltje1 · 20 okt 2009

Hoi allemaal,

Ik heb een website die bestaat uit verschillende Divs.
1 voor mn banner (bovenaan de site)
1 voor mn navigatiebalk (onder de banner)
Onder de DIV voor de navigatie balk heb ik een containerDIV. Daarin zitten 2 subDIVs. 1 voor mn menubalk links op het scherm en 1 waar mn resultaten in komen (rechts naast de menubalkDIV.)

In de resultatenDIV heb ik een aantal scrolldown menuutjes waar de bezoeker een selectie kan maken en dan op zoeken kan klikken. Het resultaat van de zoekopdracht komt bovenaan in de resultatenDIV (dus in het scherm naast de menuDIV. Het gevolg is dat de resultatenDIV daardoor groter wordt (dus in lengte toeneemt), dus alsware naar beneden schuift. Het gevolg is dat de ResultatenDIV dus langer wordt dan de MenuDIV.

Dit is niet zo'n fraai gezicht. Is er dus een manier waarop ik de MenuDIV kan linken aan de ResultatenDIV zodanig dat als de ResultatenDIV langer wordt omdat er een resultaat van een zoekopdracht inkomt, de MenuDIV automatisch mee langer wordt zodat beide DIV's even lang blijven?

Ik hoop dat jullie begrijpen wat ik bedoel.

That Guy · 20 okt 2009

jazeker kan dat.
Dit is een test-opzetje, maar het gaat uiteraard om het idee.

test.html

HTML:

<html>
<head>
<link rel='stylesheet' href='test.css' type='text/css' />
</head>
<body>

<div id="container">	
    
    <div id="header">
       header
    </div>

    <div id="linkerkant">
       linkerkant
    </div>

    <div id="midden">
       midden<br />meer midden <br />zie je?
   </div>

</div>

</body>
</html>

test.css
[JS]*
{
margin: 0;
padding: 0;
}

#container
{
width: 1000px;
overflow: hidden;
}

#header
{
width: 1000px;
height: 70px;
background-color:#666;
}

#linkerkant
{
width: 200px;
float: left;
margin-bottom: -2000px; padding-bottom: 2000px;
background-color:#0000FF;
}

#midden
{
width: 800px;
float: left;
background-color:#CCCCCC;
}[/JS]

getest, en werkt in de laatste versies van Opera, GC, Safari, FF en IE.

:thumb:

Div linken aan andere div

kareltje1

Gebruiker

That Guy

Meubilair

Nieuwste berichten

Wij waarderen jouw privacy