Div se mueve cuando el de encima crece

[laura_moreno14]

No sabia muy bien como explicarlo en el titulo. El caso es que tengo una serie de divs colocados en dos columnas con float, que muestran titulares.

Funcionaba bien hasta que cree nuevas entradas (uso wordepress) y se han descolocado los divs. En principio no tenia ni idea de que pasaba, pero tras investigarlo, creo que ocurre esto.

Cuando el tercer div tiene un titular de más de una linea, el quinto, que deberia ir justo debajo se desplaza a la posicion del sexto div. El problema es que no se por que pasa esto, ni tampoco como solucionarlo.

Les dejo el codigo y una imagen ya que lo tengo en local y no puedo poner una imagen.

Código PHP:

 <div class="excerptContList">
<div class="thumbnailList"><?php if ( has_post_thumbnail() ) { the_post_thumbnail('home3'); } ?></div>
<div class="excerptList">
<span class="WidgetCategory"><?php the_category(' ') ?></span><span class="ListTitulo"><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></span>
<span class="date"><?php echo get_the_date(); ?> | <?php the_author(); ?></span>
</div>
</div><!-- end -->  

Código CSS:

.excerptContList { width:48%; float:left; margin-bottom: 1%; padding-bottom:1%; border-bottom:#666 dashed 1px;}
.excerptContList:nth-child(odd) { margin-left:4%;}
.excerptContList a{ text-decoration:none; color:#000;}
.thumbnailList{ width:20%; float:left; }
.thumbnailList img {width:100%; height:60px; display:block; margin: 0 auto; border:#666 solid 1px; padding:3px;}
.excerptList {  width:75%; float:right; margin:5px 0 0 10px;  }
.WidgetCategory { padding:1% 2%; background:#A1C436; font-weight:bold; overflow:hidden; margin-right:5px;}
.ListTitulo { line-height:1.6em;}
.excerptList .date { display:block; font-size:0.8em; margin-top:4px;}
 
.excerptContWidget { width:100%; overflow:hidden; margin: 10px 0 0 0; padding-bottom:3%; border-bottom:#666 dashed 1px;}
.excerptWidget p { font-size:1.2em; line-height:0.5em;}
 

EDITO: no se por que no se ve la imagen...