Não estou entendendo nada. Porque a definindo a box 4 como float:right ela nao vai pra direita da box3? essa seria a logica
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!
Solucionado
Não estou entendendo nada. Porque a definindo a box 4 como float:right ela nao vai pra direita da box3? essa seria a logica
Isso tudo depende de como o pai está em relação à ele.
Se todos tiverem float, sim, a caixa vai parar do lado direito, se não , só vai pro lado direito quem tem float.
Isso também depende de como o pai foi posicionado
position: relative;
faz o elemento que está dentro dele ficar à direita do pai.
Dá pra sacar ou ainda tá muito confuso?
Espero ter ajudado , se ficou confuso, posta aqui de novo pra gente te ajudar
EDIT: Corrigi a resposta que eu havia escrito errado e adicionei um exemplo
Depende da ordem como foi escrito o HTML. Veja o seguinte dabblet:
Esse é o html desse exemplo que passei (ignorei os p):
<div id=primeiro>1</div>
<div id=segundo>2</div>
<div id=terceiro>3</div>
<div id=quarto>
<div id=interno>4</div>
</div>Para ficar igual ao exemplo, o CSS tem que ficar assim:
#primeiro {
background: red;
float: left;
}
#segundo {
background: blue;
float: left;
}
#terceiro {
background: green;
float: right;
}
#quarto {
background: yellow;
float: right;
}
#interno {
background: magenta;
}
div { height: 100px; width: 100px; }Nele você pode alterar e testar como funciona o float para entender melhor.
Para ficar exatamente igual à resposta do exercício, a div do terceiro quadrado deveria vir depois da div do quarto quadrado.
Renan,
Como a caixa 3 já está com float: right a caixa 4 não vai para a direita dela, mas vai para a direita. Assim como acontece na esquerda, para a direita os elementos vão sendo adicionados um a atrás do outro conforme foram declarados no html.
Espero que tenha entendido. Abraço.
Obrigado a todos, agora ficou mais claro. :)