28220 sujets

CSS et mise en forme, CSS3

Bonjour à tous !

Je voudrais faire une mise en page particulière avec des blocs mais ne sais pas si cela est possible.

J'ai un div main qui comprend 2 autres div menu et center.
La taille du main est automatique en fonction de celui qui sera le plus long entre menu et center.

Mais parfois le menu est plus long que le center et je voudrais donc alonger automatiquement la taille de center pour s'ajuster jusqu'en bas. En effet, mon center à un fond blanc et main un fond bleu, il y a donc une différence de couleur que je voudrais eviter.

upload/2778-css.gif

Le code css :


#main{
	position:absolute;
	background-color: #f0f0ff;
	border: 2px solid #d0d0ff;
}
#menu{
	float: left;
	width: 20%;
	margin-left: 13px;
}
#center {
	width: 75%;
	float: right;
	background-color: #FFFFFF;
	border-left: 2px dashed #d0d0ff;
}


Merci pour votre aide Smiley cligne
Bonjour Teef Smiley smile

Tu devrais trouver des pistes dans la FAQ

Quoiqu'il en soit, dans ce que tu décrits la solution la plus pratique consisterait à ne pas mettre dans un div le contenu que tu as placé dans #centre.
Si je ne met pas dans un div le contenu de center, cela voudrait dire que main serait alors en fond blanc et mon menu en fond bleu. Mais ça revient au même car après il faudrait ajuster le menu en fonction de la taille du main...

Pourquoi lorsque je fais un height: 100% pour center, il ne veut pas faire la longueur totale du bloc ? Pourquoi center ne bouge pas ?
J'ai reussi à trouver un tuto qui utilise des display: table-cell;

Mais ca ne marche pas sous IE...