dynamisme de taille pour un div conteneur

**jamdinhe** · 28/02/2011, 11h47

Bonjour,
dans mon découpage j'ai opté pour les DIV (par rapport à la recommandation du W3C qui déconseil d'utiliser les balises <table> pour la mise en page et le découpage),

mes <div> sont structurés de cette manière :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
<div id="conteneur">
  <div id="entete">
  </div>
  <div id="corp">
  </div>
  <div id="pied">
  </div>
</div>

si je met

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

#conteneur {width : 800px; margin : 0 auto; background-color : red;}

le <div id="conteneur"> ne suit pas dynamiquement la longueur des <div> qui lui sont imbriqués;

ma question porte sur le dynamisme de mon <div id="conteneur"> afin de retrouver un arrière plan unique dans le centre de mon site web quelque soit sa longueur

merci à tout ceux qui veulent aider

**Msieurduss** · 28/02/2011, 14h32

Hello,

Quelles sont les propriétés de tes autres DIV (en-tête, corpS, pied...) ?
Ca dépend aussi de ça...

L'exemple suivant (basique sans rien) fonctionne bien :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
<html>
<head>
 
<style type="text/css">
 
#conteneur {width : 800px; margin : 0 auto; background-color : red;}
#entete {width: 800px; background-color: green;}
#corps {width: 800px; background-color: grey;}
#pied {width: 800px; background-color: yellow;}
 
</style>
</head>
<body>
 
<div id="conteneur">
  <div id="entete">
	en-tête
  </div>
  <div id="corps">
	corps
  </div>
  <div id="pied">
	pied-de-page
  </div>
</div>
 
</body>
</html>

**Bisûnûrs** · 28/02/2011, 14h32

J'ai du mal à comprendre .. Ca veut dire que tes divs enfants ont une largeur supérieure à 800px ?

**ornitho13** · 28/02/2011, 14h36

Salut,

peut on avoir la CSS des autres classes à l’intérieur de ton div "conteneur", à mon avis le problème vient de là.

**jamdinhe** · 01/03/2011, 10h24

Bonjour a tous,

effectivement Msieurduss, ton exemple s'affiche comme il ce doit,

mais pour mon cas, ce n'est pas aussi simple ou plutôt basique que ca... je voulais simplifier ma question, mais enfaite, je crois que j'ai aussi fait disparaitre le problème;

pour plus de précision, voilà une image qui illustre mon découpage :

le <div> marron, représente le conteneur

le <div> rouge, représente l'entete
le <div> vert, représente le corp
le <div> bleu, représente le pied

le <div> jaune, représente le menu
le <div> gris, représente la colonne_gauche
le <div> blanc, représente le corp
le <div> orrange, représente la colonne_droite

mon problème donc, que dois-je mettre pour que le <div> corp continue de descendre jusqu'au dernier <div> enfant (colonne_gauche, corp, colonne_droite) ?

toujours prêt à donner plus d'explication si necessaire;

encore merci à tout ceux qui veulent aider

amine

**ornitho13** · 01/03/2011, 10h30

ajoute une clear:both dans l'instruction CSS de ton "pied"

Si tu pouvais donner ton HTML et ton CSS, on pourrait mieux t'aiguiller et voir le problème.

merci

**Bisûnûrs** · 01/03/2011, 10h31

Ah, quand tu parlais de longueur, tu faisais référence à la hauteur en fait .. Un overflow:hidden sur ton div corps vert devrait faire l'affaire.

Pour plus d'explications, une recherche sur le forum et la FAQ sur "dépassement de flottants" et "nouveau contexte de formatage" te donnera de nombreux résultats.

**jamdinhe** · 01/03/2011, 12h14

Envoyé par Bisûnûrs

Ah, quand tu parlais de longueur, tu faisais référence à la hauteur en fait .. Un overflow:hidden sur ton div corps vert devrait faire l'affaire.

Pour plus d'explications, une recherche sur le forum et la FAQ sur "dépassement de flottants" et "nouveau contexte de formatage" te donnera de nombreux résultats.

exactement

ce qu'il me fallait

,
merci Bisûnûrs,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part