Div positionprobleem

[Verwijderd]

Hoi,

Weg met tables, dat hoor je overal. Ik ben dan ook maar met divs begonnen.

Ik heb nu dit:


Zoals je ziet, komt de voettekst over de eigenlijke inhoud.
Hoe pas ik zoiets aan?
En hoe kan ik de gele div met het lorem ipsum net zo breed als 100% - de blauwe div maken?

Alvast bedankt.

code:

body {
    margin: 0px;
}
#pagina {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: Green;
}
#hoofding {
    position: relative;
    height: 50px;
    width: 100%;
    background-color: Green;
    float: none;
}
#beelden {
    position: relative;
    height: 100px;
    width: 100%;
    background-color: Red;
}
#menu {
    position: relative;
    height: 300px;
    width: 250px;
    background-color: Blue;
}
#inhoud {
    position: absolute;
    width: 500px;
    top: 150px;
    left: 250px;
    background-color: Yellow;
}
#voet {
    position: relative;
    width: 100%;
    left: 0px;
    bottom: 0px;
    background-color: Yellow;
}

code:

<link href="stijlblad.css" rel="stylesheet" type="text/css">
    <div id="hoofding">hoofding</div>
    <div id="beelden">beelden</div>
    <div id="menu">menu</div>
    <div id="inhoud">
        <div id="tekst">Lorem ipsum dolor sit amet...</div>
    </div>
    <div id="voet">voet</div>

[ Voor 10% gewijzigd door Verwijderd op 26-12-2005 14:09 ]

[André]

http://www.glish.com/css/
http://www.glish.com/css/9.asp
http://www.alistapart.com/articles/fauxcolumns/

Hier staan interessante methodes besproken, wellicht heb je daar wat aan