【CSS】画像の下に文字を回り込ませないコーディング

画像の横にテキストを表示した場合、テキストの量が多いと画像の下に文字が回り込んでしまいます。

それを回避するコーディングです。

このようなイメージです。

◆HTML

<div class="contents">
<img src="image.jpg" />
<p>テキスト</p>
</div>

◆CSS

.contents img {
float: left;
}

.contents p {
overflow: hidden;
zoom: 1;
}

※「zoom: 1;」はIE対策として記述しています。