P imbriqués dans un DIV

[Bob]

Bonjour à tous,

J'essaye d'imbriquer des P dans un DIV centré avec une couleur de fond.

Pas de problème sur IE, par contre sur Mozilla:

mon DIV ne veut pas englober mes deux P, il prend la hauteur d'une ligne et le reste des P dépasse vers le bas.

Voici mon code XHTML:

<div class="conteneur">
  <p class="infosLeft">texte gauche texte gauche texte gauche texte gauche texte gauche texte gauche
    texte gauche texte gauche texte gauche texte gauche texte gauche texte gauche</p>
  <p class="infosRight">texte droite texte droite texte droite texte droite texte droite texte droite
    texte droite texte droite texte droite texte droite texte droite texte droite texte droite texte
    droite texte droite texte droite texte droite texte droite texte droite texte droite texte droite</p>
</div>

Et voici mon code CSS 2

div.conteneur {
	position: relative;
	width: 390px;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	border: 0px;
	background-color: #FFFFFF;
	padding-bottom: 30px;
	background-color: Lime;
}

p.infosLeft {
	position: relative;
	float: left;
	width: 49%;
	padding: 0px;
	text-align: right;
	font-size: 12px;
}

p.infosRight {
	position: relative;
	float: right;
	width: 48%;
	padding-right: 1%;
	text-align: left;
	font-size: 12px;
}

Si j'enlève les lignes "position: relative;" et "float: right;", mes deux P s'empilent, et là le DIV les englobe complètement. Mais je ne veux pas que mes P s'empilent...

Alors si vous voyez d'où vient le problème, je suis preneur !

Merci

Bob

[Monique]

Bonjour Bob,

Si tu ajoutes overflow: auto; aux proprités de div.conteneur, cela devrait être bon.

[Bob]

Yeeeesss ! Merci beaucoup (c'est une propriété que je ne connais pas trop, je vais m'y pencher...)