まずは文字を回り込ませる方法ですが imgにfloatを使うことで文字を回り込ませることが出来ます 例 画像にCSSでfloatを書けてやると、その後に来る文字を画像に回り込ませることが出来ます HTML コード <img src="img/000.jpg" class="left"> CSS コード .left {float: left;margin-right:10px;} といった具合になります、leftとrightで右側左側をそれぞれ入れ替えて使えばOKです これで文字の回り込みをさせることが出来るのですが 問題点があります、それは文字の量が画像を覆い尽くす量が無かった場合にレイアウト崩れを起こしてしまうことです 次のコンテンツが、飲み込まれてしまっています 画像の文字の回りこみを解除する方法 解除の仕方はCSSでclear:both;を次に来る要素のCSSにつけてやるだけなのです
![CSSで画像の横に文字を回り込ませる方法と解除する方法 | 9ineBB](https://cdn-ak-scissors.b.st-hatena.com/image/square/21ad6a96246ddc2468c04802311a8e75b0f04600/height=288;version=1;width=512/https%3A%2F%2F9-bb.com%2Fwp-content%2Fuploads%2F2014%2F01%2F2d5f5dc8d684d6d51953764fca576a48.jpg)