Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Position absolute, maar dan toch ruimte innemen

3 antwoorden
  • Ik heb een nav + een subnav, zoiets:[code:1:9936878785]<ul> <li><a href="#">Item_1</a></li> <li><a href="#">Item_2</a></li> <li><a href="#">Item_3</a> <ul> <li><a href="#">SubItem_1</a></li> <li><a href="#">SubItem_2</a></li> <li><a href="#">SubItem_3</a></li> </ul> </li> <li><a href="#">Item_4</a></li> <li><a href="#">Item_5</a></li> </ul> <div>content</div>[/code:1:9936878785]En ik wil dat die subnavigatie horizontaal onder de hoofdnavgatie verschijnt, zodra er op een hoofdpagina geklikt is. Zo dus: Item_1 Item_2 Item_3 Item_4 Item_5 SubItem_1 SubItem_2 SubItem_3 Ik heb dat zo (verkort) opgelost:[code:1:9936878785]li { float: left; } ul { position: relative; } ul ul { position: absolute; left: 0px; top: 20px; }[/code:1:9936878785]Met position absolute wordt dat element uit de flow gehaald, en neemt het geen ruimte in. Dat betekent dat de content die daaronder tegen de eerste UL van de hoofdnavigatie aan zit. Dat is prima als er geen subnavigatie wordt getoond, maar als die WEL wordt getoond (dus als dat eerste UL-subniveau WEL aanwezig is) wil ik de content wat lager hebben! Is het mogelijk om een absoluut geplaatst element toch ruimte in te laten?
  • Zou zoiets werken? [code:1:c6f0d3519a]<a href="#" onclick="document.getElementById('content').style.margin-top='20px'; return: false">Item_3</a>[/code:1:c6f0d3519a] Misschien kun je voor de netheid er een functie van te maken die checkt of het al uitgeklapt is of niet zodat als je er nogmaals op klikt de boel weer teruggaat.
  • Waarom reserveer je niet gewoon wat ruimte onder je hoofdmenu? Dat is simpelweg te doen door een margin voor de onderkant op te geven. Ik weet niet direct wat het gevolg is voor de positionering van je submenu, maar dat is met een klein beetje werk snel aangepast. Dan hoef je niets dynamisch (cq met JavaScript) te doen en is alles met CSS te regelen. Het zou mijn voorkeur hebben, maar ieder zijn eigen smaak. - Bas

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.