Bonjour à tous,

je débute dans le développement en css dans le but de répondre aux normes du w3c et pour profiter pleinement des avantages fournis par cette technologie.

J'ai toutefois un problème pour organiser ma page et positionner mes éléments, je vous mets le code ici et vous explique en dessous :

/* Balises génériques */

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url("../images/fond.gif");
}

img {
border:0px;
}

p {
text-align:justify;
}

/* Cadres */

div#cadre_page{
margin-left:auto;
margin-right:auto;
text-align:center;
width:800px;
border:1px solid #FFFFFF;
}

/*Header*/

div#header{
background-image:none;
height:140px;
}

p.titre, #titre{
display:none;
}

div#header_top{
height:120px;
background-image:url("../images/header.jpg");
}

/*Menu*/

div#menurxs{
top:120px;
}

div#menurxs ul{
position : relative;
margin:0px;
padding:0px;
}

div#menurxs ul li{
position : absolute;
top:0px;
margin:0px;
padding:0px;
list-style:none;
}

div#menurxs ul li A{
position: relative;
height:20px;
display: block;
overflow: hidden;
}

ul#menu span{
position:absolute;
display:block;
top:50px;
left:50px;
}

li#menuhome{
background: url("../images/home_off.gif") no-repeat 0px 0px;
width:100px;
}
li#menuhome A{
background: url("../images/home_off.gif") no-repeat 0px -20px;
}
li#menuhome A:hover{
background: url("../images/home_on.gif") no-repeat 0px 0px;
}
li#menunews{
background:url("../images/news_off.gif") no-repeat 0px 0px;
left:100px;
width:100px;
}
li#menunews A{
background:url("../images/news_off.gif") no-repeat 0px -20px;
}
li#menunews A:hover{
background:url("../images/news_on.gif") no-repeat 0px 0px;
}
li#menuteam{
background:url("../images/team_off.gif") no-repeat 0px 0px;
left:200px;
width:100px;
}
li#menuteam A{
background:url("../images/team_off.gif") no-repeat 0px -20px;
}
li#menuteam A:hover{
background:url("../images/team_on.gif") no-repeat 0px 0px;
}
li#menuwars{
background:url("../images/wars_off.gif") no-repeat 0px 0px;
left:300px;
width:100px;
}
li#menuwars A{
background:url("../images/wars_off.gif") no-repeat 0px -20px;
}
li#menuwars A:hover{
background:url("../images/wars_on.gif") no-repeat 0px 0px;
}
li#menulinks{
background:url("../images/links_off.gif") no-repeat 0px 0px;
left:400px;
width:100px;
}
li#menulinks A{
background:url("../images/links_off.gif") no-repeat 0px -20px;
}
li#menulinks A:hover{
background:url("../images/links_on.gif") no-repeat 0px 0px;
}
li#menufiles{
background:url("../images/files_off.gif") no-repeat 0px 0px;
left:500px;
width:100px;
}
li#menufiles A{
background:url("../images/files_off.gif") no-repeat 0px -20px;
}
li#menufiles A:hover{
background:url("../images/files_on.gif") no-repeat 0px 0px;
}
li#menuirc{
background:url("../images/irc_off.gif") no-repeat 0px 0px;
left:600px;
width:100px;
}
li#menuirc A{
background:url("../images/irc_off.gif") no-repeat 0px -20px;
}
li#menuirc A:hover{
background:url("../images/irc_on.gif") no-repeat 0px 0px;
}
li#menucontact{
background:url("../images/contact_off.gif") no-repeat 0px 0px;
left:700px;
width:100px;
}
li#menucontact A{
background:url("../images/contact_off.gif") no-repeat 0px -20px;
}
li#menucontact A:hover{
background:url("../images/contact_on.gif") no-repeat 0px 0px;
}

/* // Fin menu */

/* // Fin Header */

/*Contenu*/

div#contenu{
position:relative;
margin:0px;
padding:5px;
background-color:#0B31BD;
}
div#contenu_gauche{
float:left;
width:200px;
}

#contenu_gauche_top{
text-align:left;
height:20px;
background:url("../images/haut_gauche.gif");
padding-left:20px;
}

#contenu_gauche_centre{
text-align:left;
padding-left:30px;
background-color:#AFC0FF;
}

#contenu_gauche_footer{
text-align:right;
height:15px;
background:url("../images/bas_gauche.gif");
}

div#contenu_droite{
float:right;
left:219px;
padding-left:1px;
width:570px;
}

#contenu_droite_top{
text-align:left;
height:20px;
background:url("../images/haut_contenu.gif");
padding-left:20px;
}

#contenu_droite_centre{
text-align:left;
padding-left:30px;
background-color:#AFC0FF;
}

#contenu_droite_footer{
text-align:right;
height:15px;
background:url("../images/bas_contenu.gif");
}

/* // Fin contenu*/

/*Footer*/

div#footer{
width:800px;
height:20px;
background:url("../images/footer.gif");
}

/* // Fin footer*/

/* // Fin cadres*/

Problème : le div#contenu se place par dessus le cadre de ma page, je n'arrive pas à positionner correctement les éléments et ce après de multiples tentatives, voyez vous quelque chose qui ne va pas ? Est ce que j'utilise les bonnes méthodes ???

Merci d'avance pour tous ceux qui prendront un peu de leur temps précieu pour m'aider