floatした画像の下に回り込むテキストを解除

• Jul 12, 2013
• Tags: css, tips

floatした画像の下に回り込むテキストを解除する方法。

「overflow: auto;」で解除出来ます。

HTML

<div id="container" class="cf">
<img src="img/pic.jpg" widht="200" height="150" alt="">
<p>テキスト</p>
</div>

CSS

div#container img {
 float: left;
 width: 200px;
 margin-right: 10px;
}

div#container p {
 overflow: auto;
}