Conforme apresentado na resolução e explicação do exercício, seria correto dizer que existem "2 linhas de float", sendo a sequência de elementos tratada como 2 filas distintas? Exemplo: elemento1 : float left elemento2: float right elemento3 : float left elemento4 : float right
"linha float left" : elemento1 > elemento3 "linha float right" : elemento2 > elemento4
e cosequentemente o navegador imprime "float left > float right" ?
Olá Softfocus,
Não sei se compreendi sua dúvida por completo, mas em relação ao float, quando atribuímos o float a um elemento, ele se posiciona imediatamente e procura se posicionar de acordo com a ordem dos elementos que aparecem na página e ao espaço disponível para ele.
O local que os elementos vão aparecer tem haver com o espaço disponível para eles ocuparem.
E a ordem que eles vão aparecer tem haver com a ordem em que eles aparecem na página, ou seja, se temos os elementos assim:
|elem1|
|elem2|
|elem3|
|elem4|E você aplica float:left nos elementos 1 e 3 , ele primeiro posiciona o elemento 1 à esquerda, em seguida ele posiciona o elemento 3 no próximo espaço que não tem um elemento com float, a tentando sempre colocá-lo a esquerda. Como neste caso o |elem1| já está com float à esquerda, ele tenta colocar no próximo local mais a esquerda possível que é ao lado do |elem1|.
|elem1| |elem3|
|elem2|
|elem4| Ao aplicar o float:right, nos elem 2 e 4, você está dizendo, coloque eles flutuando, no espaço mais a direita disponivél. Como o elem 2 está antes do 4 ele é posicionado primeiro no espaço mais a direita possível:
|elem1| |elem3| |elem2||
|elem4|Ai ao aplicarmos o float:right no elem 4 , ele busca o espaço mais a direita disponível que não esteja ocupado por elemento float, neste caso, ao lado do elem2.
|elem1| |elem3| |elem4| |elem2|Então o posicionamento do float tem haver com a ordem e o espaço disponível dos elementos.
Levar em consideração "linhas" diferentes pra left e right pode lhe induzir ao erro em alguns casos.
Espero que você tenha entendido, e se não foi esta sua dúvida , comente que posso tentar resolvê-la de novo !
Olá Softfocus, bom pelo que entendi com o curso, no elemento sempre que você colocar um float estará saindo da formatação padrão das Tags da pagina, flutuando assim para uma direção especifica, e alem disso o conteudo que estava abaixo irá subir, bom com isso podemos ver que todos os floats formam uma linha, um ao lado do outro enquanto houver espaço para ser ocupado, o bloco 3 estaria com um float: right portanto ao colocar float: left ao bloco 4 como ainda há espaço na tela o mesmo ira ocupar o espaço ao lado do ultimo elemento que estiver com o float: left.