CSS: плавающее изображение слева - проблема

Question

Я пытаюсь сделать что-то вроде:

--------------------------------------------
| --------- text text text text text text  |
| | image | text text text text text text  |
| |       | text text text text text text  |
| |       | text text text text text text  |
| --------- text text text text text text  |
| text text text text text text text text  |
| text text text text text text text text  |
--------------------------------------------

разметка должна быть правильной:

<div>
    <img src='myimage.jpg' style='float:left;'>
    tex text text ..
</div>

проблема в том, что если текста всего несколько, изображение будет"float out" из контейнера div, который выглядит так:

--------------------------------------------
| --------- text text text text text text  |
| | image | text text text text text text  |
|_|       |________________________________|
  |       |
  ---------

есть идеи, чтобы это исправить?единственное решение для меня, кажется, установка минимальной высоты контейнера div.ТНХ

Answer 1

div {
    overflow: hidden;  /* except IE6 */
    display: inline-block; /* IE6 */
}
div {
    display: block; /* IE6 */
}

Answer 2

добавить пустой элемент в конце элемента div с помощью style="clear:both;, вот так:

<div>
    <img src='myimage.jpg' style='float:left;'>
    tex text text ..
    <div style="clear:both;"></div>
</div>

Answer 3