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?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
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.