[CSS] Relatieve positie layer

[creator1988]

Hier is de situatie, ik heb een div met daarin een paar menubuttons, deze is gecentreerd in het midden van de pagina, de breedte is ong. 980 pixels.

Nu moet er echter een div overheen komen, nou is dat geen probleem als de div normaal (dus links en top) staat met iets als:

code:

#test
{
display: block;
position: absolute;
left: 500px;
top: 20px;
}

Maar ik krijg het niet voor elkaar als de div eromheen centered is (margin-left en right: auto); ik zoek een oplossing waarmee ik geen invloed uitoefen op de andere div's binnen de pagina zodat het menu netjes blijft. Eigenlijk dus een relatieve layer

Iemand die weet hoe ik iets absoluut kan positioneren binnen een andere div?

[Pkunk]

je parent position: relative of absolute maken? Of begrijp ik het verkeerd?

[creator1988]

Volgens mij begrijpje hem verkeerd:

dit is de structuur

code:

    <div id="boven">
        <div id="blokje1">asdas</div>
        <menudivs />
    </div>

Zo ziet het er gewoon uit:


met position: relative


met position absolute



Een combi van de onderste 2 is dus de bedoeling: geen verschuiving van andere div's, en de div wel in de moederdiv kunnen positioneren.

[ Voor 15% gewijzigd door creator1988 op 29-12-2007 13:34 ]

[Fuzzillogic]

Wat Timlog bedoelt is dat je de centrerende div (waarvoor je ook gewoon de body had kunnen gebruiken...) op position: relative; moet zetten. Dat wordt dan de nieuwe oorsprong voor de absoluut gepositioneerde elementen binnen je centrerend element.

En je bent de eerste die ik tegenkom die IE7 als development-browser gebruikt

[MBV]

En ook nog eens zonder Microsofts Web Development Toolbar, dan kan je inderdaad erg slecht debuggen wat er nou weer fout gaat

[creator1988]

Fuzzillogic schreef op zaterdag 29 december 2007 @ 13:58:En je bent de eerste die ik tegenkom die IE7 als development-browser gebruikt

Hee, ik ben ontwikkelaar, geen vormgever ;-)

En IE i.c.m. Visual Studio werkt nou eenmaal erg prettig qua debugging en auto-afsluiten.

En verder:

code:

        #boven
        {
            position: relative;
        }

werkt als een tiet. Danke.