Div auto-dimensionnée avec priorité de l'un sur l'autre

Hello,

J'aimerais réaliser la chose suivante :



C'est à dire : deux divs côte à côte. Le premier est une liste. Le plus grand élément de la liste fixe la taille du div de gauche. Le div de droite s'ajuste pour occuper 100% de l'espace restant disponible.

Je suis pas trop préoccupé par la compatibilité sur les vieux navigateurs donc j'ai essayé de réaliser ça avec flexbox qui avait l'air une solution appropriée mais en vain.

Merci beaucoup !

Félix

display: table semble tout indiqué dans ton cas de figure.

Merci !
Un exemple plus complet serait bienvenu

Avec display:table, je ne vois pas commencer donner la priorité d'attribution de l'espace à la première colonne. Si les deux divs ont du contenu large, qu'est-ce qui me dit que celui de gauche ne va pas se retrouver écrasé ?

Edit : et en plus c'est pas joli joli si ? Enfin là j'essaie de faire un truc propre et moderne
Modifié par Felix38 (27 Jun 2014 - 23:08)

Felix38 a écrit :

Un exemple plus complet serait bienvenu

Google.

Felix38 a écrit :

Avec display:table, je ne vois pas commencer donner la priorité d'attribution de l'espace à la première colonne. Si les deux divs ont du contenu large, qu'est-ce qui me dit que celui de gauche ne va pas se retrouver écrasé ?

La propriété white-space devrait te permettre de gérer.

Felix38 a écrit :

Edit : et en plus c'est pas joli joli si ? Enfin là j'essaie de faire un truc propre et moderne

Je ne vois aucun rapport entre la propriété display et l'aspect visuel de ta page, absolument aucun.

Bonjour,

Pour ne pas me répéter : <table> HTML, display: table; CSS

salut,
ou bien encore plus simple et rétrocompatible

<div>
	<ul>
		<li>ceci est un texte long</li>
		<li>2</li>
		<li>3</li>
	</ul>
</div>
<div></div>

div:first-child {float:left;}
div+div {overflow:hidden;}