чехарда с блоками - Вопросы по CSS

Есть страница товара (см. вложение 1.jpg), на ней блок изображения 1, блок с ценами 2, блок с описанием 3.
1-й блок-изображение заключен в тег <div>, 2-ой блок-цены тоже заключен в тег <div> к которому прописан float: left и width: 50%, 3-ий блок-описание заключен в тег <p>.
Проблема в том, что при просмотре страницы на более маленьких мониторах, все блоки ползут (см. вложение 2 и 3). Как это исправить? Как прописать, чтобы 3-ий блок-описание при уменьшении изображения не залезал на место 2-ого и всегда был после 2-ого?

Надо для блока описания задать clear: both;

Надо для блока описания задать clear: both;

Офигеть как всё просто), а я голову ломал. Огромное спасибо!