FC ConcursosFC Concursos

Questão FC373512

Em uma página web criada com HTML5 e CSS3 há 3 contêineres com nome de classe caixa, criados com a tag div. Criou-se para estes contêineres a seguinte configuração CSS. div.caixa{

Desenvolvimento Web

FCC · 2019

Em uma página web criada com HTML5 e CSS3 há 3 contêineres com nome de classe caixa, criados com a tag div. Criou-se para estes contêineres a seguinte configuração CSS.

 

div.caixa{

width:300px;

height:200px;

border:solid #c0c0c0 1px;

}

 

Para que os contêineres sejam posicionados um ao lado do outro horizontalmente deve-se adicionar ao bloco CSS acima a instrução

  1. position: side-by-side;
  2. box-position: left;
  3. position: relative;
  4. align: side-by-side;
  5. float: left;
Mostrar resposta e comentário

Gabarito

Errado

Comentário do professor

float: left; aplica-se para posicionar as divs lado a lado. Por padrão uma div é um elemento block-level, que inicia em nova linha e ocupa toda a largura disponível.

Ao usar float: left; o elemento é retirado do fluxo normal e ancorado à esquerda do contêiner. Outros elementos flutuantes subsequentes ocuparão o espaço à sua direita, permitindo o layout horizontal das caixas.

Para que fiquem realmente alinhadas, a soma de width + border + margin de cada caixa deve caber na largura do contêiner pai; caso contrário, as caixas irão quebrar para a linha seguinte.

Observe que elementos flutuantes não expandem a altura do pai. Para conter as floats, use um clearfix ou aplique overflow: auto; / overflow: hidden; no elemento pai.

Conteúdo do catálogo FC Concursos · Atualizado em

Continue aprendendo