Boa tarde, ao colocar float left na caixa 4, a caixa 5 não deveria subir e ocupar o posicionamento da caixa 4? Por que ficaria um espaço em branco?
Boa tarde, ao colocar float left na caixa 4, a caixa 5 não deveria subir e ocupar o posicionamento da caixa 4? Por que ficaria um espaço em branco?
Boa tarde, bruno!
Por causa dessa afirmação aqui: Repare que as caixas 4 e 5 estão com a declaração clear: both para ficarem abaixo das outras.
O clear: both faz com que a caixa 5 fique abaixo dos elementos que estão floating. Se você imaginar uma linha horizontal, o clear: both vai fazer a caixa 5 ficar abaixo do elemento mais baixo que, nesse caso, é a caixa 3.
O clear: both é muito utilizado nos rodapés das páginas, porque eles devem sempre ficar abaixo de todos os elementos das páginas, não importando qual elemento esteja mais baixo, o rodapé deve sempre ficar abaixo de todos, por isso, geralmente, colocamos a div do rodapé com clear: both.
Se ainda tiver dúvida, só postar!
Abraço.