[HTML/CSS] structure en CSS [Résolu] - j'arrive po :(

Logiciel & apps Programmation
1

:hello:

J’aimerais faire quelques chose en CSS, mais j’y arrive pas… :frowning:

le principe est ici :

http://img127.imageshack.us/img127/8071/structure9ia.png

Je veux afficher ces infos.
Il n’y a peut être pas de photo, donc un bloc peut être vide.
La hauteurdes blocs est variable, mais chaque bloc “cote à cote” doit commencer à la même positition (pour ne pas avoir de décalage vertical)

j’ai essayé d’entourer chaque bloc de div :

.play_bloc {
width: 295px;
float: left;
}

ça pourrait fonctionner, mais lorsque le bloc de droite est plus petit que celui de gauche, le troisième (qui devrait apparaitre dessous normalement) vient directement dessous, c’est génant.

exemples
http://www.team-zog.net/player_6.htm
http://www.team-zog.net/player_14.htm

avec et sans photo

comment faire ?

2

Fais ça avec display: table; En gros, ça donnerait quelque chose comme :

div#table {
    display: table;
}

div#table div.row {
    display: table-row;
}

div#table div.row div {
    display: table-cell;
}

Et en HTML :

<div id="table">
  <div class="row">
    <div>
      Infos perso
    </div>
    <div>
      Photo
    </div>
  </div>
  <div class="row">
    <div>
      Hardware
    </div>
    <div>
      Favorites
    </div>
  </div>
</div>

J’suis pas un pro du CSS donc peut-être que quelqu’un aura mieux en fait :wink:

3

Sachant que display: table n’est pas supporté par IE6 & 7 (de toute façon, IE7 = IE6 en plus moche). Utilise directement les tableaux.

4

Bon j’ai bidouillé et ça fonctionne.

merci quand même :wink: