Questão FC546380
Considere o comando CSS3: @media (max-width: 600px){.container {flex-direction: column;}} Esse comando
Desenvolvimento Web
FCC · 2025
Considere o comando CSS3:
@media (max-width: 600px){.container {flex-direction: column;}}
Esse comando
- altera a propriedade flex-direction para column sempre que a altura do .container estiver abaixo de 600px, independentemente da largura.
- garante o layout de coluna no .container para qualquer dispositivo móvel, sem levar em conta a largura da tela.
- aplica a propriedade flex-direction: column ao .container, fazendo com que seus elementos sejam alinhados verticalmente quando a largura do dispositivo estiver em até 600px.
- define a largura do .container como exatamente 600px a partir do momento em que a tela atinge ou fica abaixo desse valor, ignorando qualquer modificação posterior de largura.
- altera a direção do flex para column apenas quando a largura do dispositivo exceder 600px, sem afetar resoluções menores.
Mostrar resposta e comentário
Gabarito
Certo
Comentário do professor
@media (max-width: 600px) é uma media query que ativa o bloco interno somente quando a largura da janela ou dispositivo for até 600px. Dentro dela, a regra alvo é a classe .container com a propriedade flex-direction: column.
Aplicando flex-direction: column à .container, os itens filhos passam a ser dispostos no eixo vertical, ou seja, ficam empilhados verticalmente. Essa mudança altera o fluxo do contêiner flex do padrão horizontal para vertical.
Para que flex-direction tenha efeito, o elemento precisa ser um contêiner flex, por exemplo com display: flex. A regra dentro da media query substitui o comportamento anterior apenas enquanto a largura estiver em até 600px, favorecendo layouts responsivos.
Conteúdo do catálogo FC Concursos · Atualizado em