Floaten in CSS

Stel we hebben twee div's met de klasse parent. In elk zit een kleine hoeveelheid tekst, en in de eerste div staat een afbeelding waaraan de eigenschap float is toegewezen met de waarde left.

Zoals je al weet, zal de afbeelding in dit geval over het tweede blok heen schuiven:

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;
}

Результат:

Laten we in de volgende lessen bekijken, hoe we zo'n overlapping of floaten kunnen voorkomen.