[CSS] hauteur max de div

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [CSS] hauteur max de div

drlobo

hello, je me casse la tête depuis 2 bonnes heures pour reussir à faire quelques chose de tout con.

un div "panel" de 150px de large qui est est a gauche (pour la navigation) et un div "main" principal

mon soucis est que si le contenu du div princiapl est plus haut que la hauteur de la page, mon div panel lui reste a la meme hauteur est ne s'agrandit pas.

J'ai essayé un tas de positionnement different mais j'en ai trouvé aucun qui marche.
J'en suis même venu à penser revenir a une table à 2 cellules...

Des solutions?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>test</title>
<style type="text/css">
body{
color: #000000;
font-family: Arial, Geneva;
font-size: 12px;
margin:0px;
height:100%;
}
.panel{
border: 1px solid red;
width: 150px;
height: 100%;
float:left;
}
.main{
height:1000px; /*seulement pour l'exemple*/
border: 1px solid black;
}

</style>
</head>
<body>

<div class="panel">
ce div doit prendre la hauteur maximale
</div>
<div class="main">
La hauteur de ce div est definie par son contenu (pas de hauteur fixe)
</div>

</body>
</html>

Publicité

gizmo

si la hauteur du div englobant n'est pas exprimé explicitement, ce n'est pas possible. Par contre, rien ne t'empèche de faire un faux fond qui prolonge ton panel.

gm_superstar

Appelez-moi Super

DrLobo a écrit :

Des solutions?

Ne pas spécifier de hauteur pour #main

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

leonnard

c'est pourtant simple

tu mets tes deux div dans un div principal ce qui te donne

<body>
<div id="principal">
<div class="panel">
ce div doit prendre la hauteur maximale
</div>
<div class="main">
La hauteur de ce div est definie par son contenu (pas de hauteur fixe)
</div>
</div>
</body>

ensuite tu appliques une couleur (ici white )ou une image ( par exemple cette image peut-être 105px blanc ( largeur de ton div panel) puis le 106px est black puis 107px gray) au div principale

#principal{
background-image: url(images/barre.jpg);
background-repeat: repeat-y;
background-position-x: left;
[#00ff00]background-color: white; ( à mettre si tu n'utilise pas d'image)
}

la finte est là, maintenant tu ne mets pas de bakground au "panel"

.panel{
...;[background-color: transparent;}

ainsi le panel à la couleur ou l'image de fonds du "principal"

tu peux en plus rajouter un border-left au " main"

.main{border-left: #ff6600 1px solid;}

ou aligner une image à gauche de ton main

.main{background-image: url(images/barre.jpg);
background-repeat: repeat-y;
background-position-x: left;}

tchao

FORUM HardWare.fr

Programmation

HTML/CSS

[CSS] hauteur max de div

Sujets relatifs
[Javascript & CSS] position de l'appel	Hauteur en CSS ?
[CSS / HTML] Quel navigateur choisir ?	CSS - Probleme de hauteur pour un div englobant
[CSS] problème de DIV avec CLASS	[CSS] Feuille print qui part en sucette
[CSS] Div -> le texte ne s'affiche pas car pas de scrollbar	[CSS]un hover sur une cellule de tablo????
[CSS] Diminuer la hauteur d'une cellule de tableau proprement.	Div et hauteur, result diff. sur IE et Mozilla [XHTML et CSS]
Plus de sujets relatifs à : [CSS] hauteur max de div

Page générée en 0.044 secondes