Blocs de même hauteur plusieurs fois

Bonjour,

En ce moment j'essaye d'adapter une site fait en tableaux à la base en div.
Mais je me heurte à un gros prôblème. Au milieu d'une des pages (la page d'accueil), il y a un tableau d'actualités sur deux colonnes et une dizaines de lignes.

Chaque cellule représente une actuélités avec une image, un peu de texte et un lien,... Mon problème est qu'il faut impérativement que l'actualités de gauche soit aligner avec celle de droite (question d'ergonomie et d'équilibre de la page). Alors du coup je me suis basé sur le tutorial "des blocs de meme hauteur sans tableau.

Ce tuto propose de mettre les div en position:absolute mais comme j'ai plusieurs lignes à suivre elles se chevauchent entre elles sous IE6 quand je passe sous une plus petite résolution (800*600).

En définissant une taille de div suffisament grande ça passe bien mais évidemment en 1024 l'espace est beaucoup trop grand..



Le bug doit être connu, ça concerne les colisions de div en absolu sous IE mais je ne vois pas trop comment arranger ça.

niveau structure ça ressemble à ça

<div class="lignenews">
  <div class="news gauche">
       <h2>...</h2>
       <img ............ />
       <p>.......</p>
  <div>
  <div class="news">
       <h2>...</h2>
       <img ............ />
       <p>.......</p>
  <div>
</div>
<div class="lignenews">
  <div class="news gauche">
       <h2>...</h2>
       <img ............ />
       <p>.......</p>
  <div>
  <div class="news">
       <h2>...</h2>
       <img ............ />
       <p>.......</p>
  <div>
</div>

et la mise en forme et faite comme cela

.lignenews{
	position:relative;
	min-height:160px;
	margin:0;
	width:100%;
}

.news{
	position:absolute;
	right:0;
	width:45%;
	padding:5px 10px 2em 10px;
	margin:0;
	min-height:160px;
	font-size:0.9em;
	-moz-box-sizing:border-box;
}

.news.gauche{
	left:0;
	right:auto;
	border-right:solid 3px #d64300;
}

.news h2{
	background:url('...') no-repeat left;
	padding:5px 0 5px 16px;
	font-size: 1em;
	font-weight: bold;
	color: #ba0000;
}

.news img{
	position:relative;
	float:left;
	margin-right:5px;
}

voilà pour ceux qui voudront bien se donner la peine de lire..

Heu... tu aurais pas ça quelque part en ligne (mode flemme enclenché...) ?

Edit : et, si possible, une image de ce que tu voudrais faire.
Modifié par mpop (29 Dec 2006 - 21:28)