Bonjour,
Je souhaite créer une page avec plusieurs DIV suivies et/ou imbriquées :
1 div header
1 div menu (horizontale sous le header)
1 div principale (main) sur 100% de la largeur du body avec :
- 2 colonnes (2 div) qui se partagent le main
1 div (bas) en bas du main sur 100% de la largeur du body pour contenir une image de fin de page
1 div pied de page (footer) pour le copyright
Mon problème est que si je ne fixe pas de hauteur à mon main (ce que je veux surtout pas), la partie "bas" se colle n'importe où.
Pour info, j'ai un fond (derrière le main) à mettre et qui doit se prolonger en fonction de la longueur de la colonne gauche qui est dans ce main.
Voici mon CSS; quelqu'un peut-il me dire ce qui cloche ? Merci beaucoup par avance de votre aide.
body {width:935px;margin:0 auto;
}
#header {height:408px; background-image:url(img/fondheader.jpg); background-repeat:no-repeat;
}
#menu {height:100px;background-color:#CC0000;
}
#main {width:100%;background-image:url(img/fondcontent.gif); background-repeat:no-repeat;
}
#mainleft {float:left; width:60%;
}
#mainright { float:right;width:40%;
}
#bas {height:100px;background-image:url(img/fondcontent_bas.gif); background-repeat:no-repeat;
}
#footer { height:60px;background-color:#CCCCCC;
}
Mon fichier html est simple :
<body>
<div id="header">
</div>
<div id="menu">
c'est le menu
</div>
<div id="main">
<div id="mainleft">partie gauche de la partie principale</div>
<div id="mainright">partie droite de la partie principale</div>
</div>
<div id="bas">c'est le bas</div>
<div id="footer">
c'est le pied de page
</div>
</body>
Configuration: XP Pro, Dreamweaver CS3, Photoshop CS3, IE7, FX3
450d flou
