html/css : des "lignes à hauteur dynamiques" ?

Marsh Posté le 26-10-2011 à 16:01:33

Bonjour à tous.
Je débute en html/css, et je m'arrache les cheveux sur un probleme qui me parait simple (mais qui ne l'est peut etre pas en fait?)
Je voudrais avoir des lignes contenant chacune trois éléments (qui utilisent chacun 30% de la largeur de l'écran). Chaque ligne doit avoir la hauteur du plus grand élément qu'elle contient.
Mon code est ci-dessous, et j'ai attaché un screenshot du résultat que j'essaye d'avoir :-)

merci ! :-) :jap:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Test</title>
<style type="text/css">
body
{
color: purple;
background-color: #d8da3d
}

.resultBlock li
{
background:#FFF;
margin:5px;
padding:5px;
display:block;

border: 1px solid #000;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;

width : 30%;
float:left;
}

</style>
</head>

<body>

<lu class='resultBlock'>
<li>

<div style="height:80px;">
A1<br>A1(suite)
</div>

</li>
<li>
<div >A2<br>A2 suite<br>A2 suite bis<br>A2 (4)<br>A2(5)</div>
</li>
<li>
<div >A3</div>
</li>
<li>B1</li>
<li>B2</li>
<li>B3</li>
</lu>

</body>

Marsh Posté le 26-10-2011 à 16:01:33

Marsh Posté le 26-10-2011 à 16:05:38

le résultat que je cherche à avoir:
https://lh6.googleusercontent.com/- [...] 2/truc.jpg

J'ai essayé avec des <lu><li>..., des tables, des div, etc... je n'ai jamais réussi à avoir le résultat voulu...
:pt1cable:

Message édité par mkdotcom le 26-10-2011 à 16:09:51

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed

Name *

Email *

URL

Message *