Div separado con clearfix en CSS

En realidad, el clearfix se usa más comúnmente en forma de un div separado, que se coloca antes del div para el cual deseas cancelar el solapamiento, así:

html<div class="parent">
  <img src="img.png" alt="">
  texto
</div>
<div class="clearfix"></div>
<div class="parent">
  texto
</div>

css.parent {
  border: 1px solid red;
}
.parent img {
  float: left;
}

.clearfix {
  clear: both;
}

Результат: