В верстке двухколоночный макет
для левой колонки задано обтекание справа при помощи float: left, в блоке, где находятся посты блога
<article class="post">
<h2 class="postTitle"> Оптимизация страниц сайта</h2>
<p class="postInfo">Создана <time datetime="2011-06-14" class="postDate">14.06.2011</time>, Категория <a href="javascript:void(0)" class="postLink">Статьи</a>, by <a href="javascript:void(0)" class="postLink">babanovd</a></p>
<div class="postImg">
<img src="images/image_2.jpg" alt="" title="" />
</div>
<p class="postText">Любой сайт состоит из нескольких (десятков, сотен, тысяч) страниц. Любая страница — это некий HTML-код. HTML-код, в свою очередь, — это набор тегов, из которых и формируется страница.Оптимизация страниц — важнейший этап в продвижении сайта. Его можно разбить на следующие шаги.</p>
<a href="javascript:void(0)" class="postFullLink">Продолжить</a>
</article> <!-- /article-->
для изображения так же задано float: left.
Не могу разобраться, как сделать так, чтобы последующий пост не наползал на предыдущий, если в посте мало текста, как это получается здесь.
Если задать после p class="postText" <div class="clear"></div>
то возникает разрыв link text.
Как можно добиться нужного расположения элементов?