Hi,
To do this, you can do something like this :
<div class="posts" style="display: block;">
<div class="left-posts" {{{style="clear: left; float: left; width: 50%;"}}}>
<h3 style="..."><?php the_title ?></h3>
<div class="post-content" {{{style="float: left; vertical-align: top; border: 0px solid silver; margin-right: 5px;"}}}>
<?php if (has_post_thumbnail()) {
echo '<div class="attachment-thumbnail">';
the_post_thumbnail('post-thumb', array('title' => trim(strip_tags( $attachment->post_title ))));
echo '</div>';
the_excerpt('Lire la suite de cet article »');
}
else
{
the_content('Lire la suite de cet article »');
}
?>
</div>
<div class="right-posts" {{{style="clear: none; float: right; width: 50%;"}}}>
<h3 style="..."><?php the_title ?></h3>
<div class="post-content" {{{style="float: left; vertical-align: top; border: 0px solid silver; margin-right: 5px;"}}}>
<?php if (has_post_thumbnail()) {
echo '<div class="attachment-thumbnail">';
the_post_thumbnail('post-thumb', array('title' => trim(strip_tags( $attachment->post_title ))));
echo '</div>';
the_excerpt('Read more »');
}
else
{
the_content('Read more »');
}
?>
</div>
</div>
As you can see, you have to truncate the 2 columns with 2 CSS rules (1 for the posts on the left and 1 for the posts on the right)
You will see which CSS attribute to create/update between the {{{…}}}