FC ConcursosFC Concursos

Questão FC373518

Em uma página web um Analista de TI criou um contêiner com outros 3 contêineres em seu interior, como mostra a imagem abaixo. Os códigos CSS e HTML são mostrados abaixo. .conteiner

Desenvolvimento Web

FCC · 2019

Em uma página web um Analista de TI criou um contêiner com outros 3 contêineres em seu interior, como mostra a imagem abaixo.

 

 

Os códigos CSS e HTML são mostrados abaixo.

 

     .conteiner {

        ...I...

        border:solid #c0c0c0; 1px

     }

     .conteiner > div {

        background-color: #c0c0c0;

        margin: 10px;

        padding: 20px;

        font-size: 30px;

     }

 

     <div class="conteiner">

       <div>Água</div>

       <div>Esgoto</div>

       <div>Outros</div>

     </div>

 

Para conseguir a disposição dos contêineres mostrada na figura, a lacuna I deve ser corretamente preenchida por

  1. float:left;
  2. display: flex;
  3. position:horizontal;
  4. align:side-by-side;
  5. position:flexible;
Mostrar resposta e comentário

Gabarito

B

Comentário do professor

Ao aplicar display: flex; no seletor .conteiner, o elemento pai passa a ser um contêiner flex e seus filhos diretos tornam‑se itens flexíveis. Isso organiza automaticamente os três div internos em linha, pois o valor padrão de flex-direction é row.

Com isso, as propriedades já definidas nos filhos (como margin, padding e font-size) continuam válidas, mas o fluxo passa a ser controlado pelo modelo Flexbox, facilitando alinhamento e distribuição sem usar float ou posicionamento absoluto.

Além disso, você pode ajustar alinhamento e espaçamento global com justify-content e align-items no contêiner pai para obter layouts responsivos e previsíveis.

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

Continue aprendendo