Min-height et compagnie

Bonjour,

je suis face à un cas délicat que je ne parviens pas à régler.

Au départ j'ai ça :



Il s'agit de 2 blocs <dl> positionnés en float:left

Je voudrais, lorsque le contenu de l'un des deux blocs augmentent, que la taille de l'autre bloc s'adapte comme ci-dessous :



Voici le code de l'exemple :

<div id="cont">

	<dl class="a">
		bla bnlabla bla bla bnlabla bla bla bnlabla bla bla bnlabla blabla bnlabla blabla bnlabla bla 
	</dl>

	<dl class="a">
		bla bla bnlabla bla bla bnlabla bla 
	</dl>

	<div id="clear"></div>


</div>

CSS:

#cont{
background:#CCCCCC;
min-height:150px;
width:600px;
padding:5px;
}

.a{
float:left;
background:#FFCC66;
width:200px;
height:100%;
margin-left:5px;
}

#clear{
clear:both;
}

Je sais que je peux obtenir ce que je cherche à l'aide de tableaux, m'enfin s'il y avait une solution sans table, ça serait plus sympathique !
Modifié par bill_baroud (12 Dec 2006 - 11:47)

Hello,
alors en vrac et au choix :

- technique des colonnes factices
- javascript, par exemple avec Niftycube
- tableau (solution la plus simple et qui n'est pas pire que d'utiliser des <dl> à contre emploi...)

merci, je vais opter pour le tableau.