CSSでのフロート

ここに、クラスが parentの2つのdivがあるとします。 それぞれに少しテキストがあり、最初のdivには floatプロパティが leftに設定された画像が配置されています。

ご存知の通り、この場合、画像は2番目のブロックにはみ出して重なります:

html<div class="parent">
  <img src="img.png" alt="">
  text
</div>
<div class="parent">
  text
</div>
css.parent {
  border: 1px solid red;
}
.parent img {
  float: left;
}

Результат:

次のレッスンでは、このような重なりやフロートを 回避する方法について見ていきましょう。