Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Position absolute, maar dan toch ruimte innemen

Buur
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

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