Bonjour à tous,
Voila, je tourne en rond depuis un paquet d'heure. Je vous expose mon problème :
J'ai 3 divs, le premier et le dernier d'une hauteur fixée en pixels, et celui du milieu doit prendre toute la hauteur restante. Voici mon point de départ :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style>
* {
padding: 0px;
margin: 0px;
}
html, body {
width: 100%;
height: 100%;
overflow: hidden;
}
div {
width: 100%;
}
#d1 {
background-color: #fcc;
height: 32px;
}
#d2 {
background-color: #cfc;
height: 80%;
}
#d3 {
background-color: #ccf;
height: 64px;
}
</style>
</head>
<body>
<div id="d1">Div 1 (hauteur en px)</div>
<div id="d2">Div 2 (complete le reste)</div>
<div id="d3">Div 3 (hauteur en px)</div>
</body>
</html> |
Le 80% n'est évidement pas bon. Mais il donne l'idée de ce que je voudrais. Une sorte de 100%-32px-64px.
J'ai essayé sans succès des bidouilles avec des margin et padding, positifs ou négatifs. Je ne souhaite pas passer par javascript.
Si quelqu'un pouvait apporter un regard neuf sur ce problème, je lui en serais très reconnaissant.
Merci beaucoup !
Edit : ré-écrire le problème au propre m'a permis de régler moi-même le problème, désolé pour la pollution des topic :$ Il fallait mettre un margin sur le Div 2.
Message édité par Habaxin le 12-05-2009 à 16:19:23