Je ne sais pas si mon titre est très clair
Voici ma CSS:
Mon code HTMLbody {
background-color: #000000;
color: #FFFFFF;
}
.headerlogo {
float: left;
top: 1em;
left: 1em;
width: 180px;
border: solid 2px;
border-color: green;
}
.headercontent {
margin-top: 1em;
margin-left: 200px;
margin-right: 2em;
height: 101px;
width: 100%;
border: solid 2px;
border-color: green;
}
.mainmenu {
float:left;
margin-top: 1em;
margin-bottom: 2em;
width: 180px;
height: 80%;
background-color: #FFECCE;
border: solid 2px;
border-color : #666666;*/
}
.maincontent {
margin-top: 1em;
margin-left: 200px;
margin-right: 2em;
margin-bottom: 2em;
height: 80%;
width: 70%;
background-color: #FFECCE;
border: solid 2px;
border-color : #666666;*/
}
Voici le rendu :
<html>
<head>
<link type="text/css" rel="stylesheet" href="web/styles/main.css">
</head>
<body>
<div class="headerlogo">
<img src="web/images/logos/eurosec2006_noir_small.jpg" alt="Eurosec 2006" />
</div>
<div class="headercontent">
Sahara
</div>
<div class="mainmenu">
Toto
</div>
<div class="maincontent">
test
</div>
</body>
</html>
Il est satisfaisant en terme de placement par contre j'ai un problème avec la longueur des mes div menucontent et maincontent.
Comment spécifier une longeur ? la partie à gauche est fixe en terme de pixels à cause du logo et si je mets 70%, l'espace tout à droite va varier selon la résolution. Si je mets 100%, le div est fatalement trop grand.
Je ne vois pas très bien comment procéder
Partager