Eso es un hack para eliminar el flujo producido por algún
float anterior.
Ese estilo se aplica a un pseudo
elemento:after
Lo que hace es que para no agregar otro <div> o un <br /> o cualquier tag con el atributo
clear, que rompa el float anterior, agrega un elemento nuevo en automático a través del CSS, pero invisible ya que el content está "
vacío". El display table es para que aunque esté vacío sea un elemento de bloque,
table.
Esto en realidad no hace NADA al siguiente div, a tu footer. Lo que hace es que lo anterior
no le afecte.
---
Alternativas hay varias... pero lo principal es no usar float. Usar flexbox.
El float déjalo para mandar texto al rededor de una foto y cosas así.