Float: right; e Clear: both;
27/07/2019
0
OBS: .BLOCO3
CLEAR: BOTH ; NÃO FUNCIONOU ?
O BLOCO 3 ESTÁ COM O BLOCO 4 ENCOSTADO A SUA ESQUERDA.
FICO GRATO SE ALGUÉM EXPLICAR?
.container {
text-align: center;
line-height: 200px;
font-size: 50px;
}
.bloco1 {
height:200px; width: 200px;
background: #00FFFF;
float: right;
}
.bloco2 {
height:200px; width: 200px;
background: #FF4500;
float: right;
}
.bloco3 {
height:200px; width: 200px;
background: #7B68EE;
float: right;
clear: both;
}
.bloco4 {
height:200px; width: 200px;
background: #FFFF00;
float: right;
}
.bloco5 {
height:400px; width: 400px;
background: #FF1493 ;
line-height: 400px;
float: right;
}
CLEAR: BOTH ; NÃO FUNCIONOU ?
O BLOCO 3 ESTÁ COM O BLOCO 4 ENCOSTADO A SUA ESQUERDA.
FICO GRATO SE ALGUÉM EXPLICAR?
.container {
text-align: center;
line-height: 200px;
font-size: 50px;
}
.bloco1 {
height:200px; width: 200px;
background: #00FFFF;
float: right;
}
.bloco2 {
height:200px; width: 200px;
background: #FF4500;
float: right;
}
.bloco3 {
height:200px; width: 200px;
background: #7B68EE;
float: right;
clear: both;
}
.bloco4 {
height:200px; width: 200px;
background: #FFFF00;
float: right;
}
.bloco5 {
height:400px; width: 400px;
background: #FF1493 ;
line-height: 400px;
float: right;
}
Fabio Akira
Curtir tópico
+ 0
Responder
Post mais votado
27/07/2019
Crie uma classe .clear {clear=both;}, no html crie um div vazia após as divs que você usa o float e aplique a case clear. Espero ter ajudado.
Lucas Rodrigues
Responder
Mais Posts
28/07/2019
Fabio Akira
Crie uma classe .clear {clear=both;}, no html crie um div vazia após as divs que você usa o float e aplique a case clear. Espero ter ajudado.
Deu Certo obrigado!!! Porém eu queria saber o porque disso acontecer, se poder explicar com mais detalhes eu agradeço?!
Responder
03/08/2019
Lucas Rodrigues
Crie uma classe .clear {clear=both;}, no html crie um div vazia após as divs que você usa o float e aplique a case clear. Espero ter ajudado.
Deu Certo obrigado!!! Porém eu queria saber o porque disso acontecer, se poder explicar com mais detalhes eu agradeço?!
Basicamente é o seguinte, quando você usa float nos elementos eles saem do fluxo normal do html, essa div onde você aplicou os clear, ela zera as funcionalidades do float fazendo com que os outros elementos respeite esse fluxo, é quase que um bug do css.
Responder
Clique aqui para fazer login e interagir na Comunidade :)