[CSS] probleme avec un div conteneur

Version imprimable

Bonjour,
J'essaie de mettre deux divs dans un seul (conteneur) div :
Code:

1 2 3 4 5 6 7 8 <div id="conteneur"> <div id="divOne"> <h2>Gerez vos abonnements internet chez nous.</h2> </div> <div id="divTwo"> <a href="">Fermer</a> </div> </div>
mon probléme c'est que le div conteneur disparait bizarrement et la page s'affiche comme si il n'y avait que les deux divs (divOne et divTwo).
donc si par exemple je voudrais mettre une couleur de background pour le div (conteneur) cela ne marcherait pas et mes deux divs (divOne et divTwo) s'afficheront sur le background color du body.
Voila la feuille de style :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 #conteneur { clear: left; background: #101010 url(../img_fr/bgContainer.gif) no-repeat bottom right; border-bottom: 1px solid #505050; } #divOne { float: left; width: 550px; padding: 10px; } #divTwo { float: right; text-align: right; width: 100px; }

Tu peux utiliser une astuce pour corriger ça en rajoutant une div avec un clear: both; :

HTML:

Code:

1
2
3
4
5
6
7
8
9
10
<div id="conteneur">
   <div id="divOne">
   <h2>Gerez vos abonnements internet chez nous.</h2>   
   </div>
   <div id="divTwo">
   <a href="">Fermer</a>
   </div>
   <div class="blank">
   </div>
</div>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
#conteneur {
   clear: left;
   background: #101010 url(../img_fr/bgContainer.gif) no-repeat bottom right;
   border-bottom: 1px solid #505050;
   }
#divOne {
   float: left;
   width: 550px;
   padding: 10px;
   }
#divTwo {
   float: right;
   text-align: right;
   width: 100px;
}
.blank {
   clear: both;
}

26/01/2006, 14h13
ddeee

en mettant une hauteur fixe au bloc container
height:200px;

mais la solution de Trunks est beaucoup mieux !!
je la garde dans un coin, merci trunks
26/01/2006, 14h16
franculo_caoulene
Dans ce cas précis (un seul élément contenu dans le div), pourquoi utiliser un div? Supprime les div et mets un id à tes éléments. Je répète, dans ce cas précis (ou même d'autres éventuellement).
Code:

1 2 3 4 <div id="conteneur"> <h2 id="divOne">Gerez vos abonnements internet chez nous.</h2> <a id="divTwo" href="">Fermer</a> </div>
26/01/2006, 17h26
Trunks

Faut remercier linaa, c'est elle qui a proposé cette solution en première.