Considere o comando CSS3:@media (max-width: 600px) {.contain...
Considere o comando CSS3:
@media (max-width: 600px) {.container {flex-direction: column;}}
Esse comando
Gabarito comentado
Confira o gabarito comentado por um dos nossos professores
Alternativa correta: C
1. Tema central da questão
Esta questão aborda o uso de Media Queries no CSS3, especificamente como ajustar o layout responsivo de um elemento com Flexbox de acordo com a largura da tela do dispositivo. O candidato deve conhecer o funcionamento dos seletores @media, a propriedade flex-direction e a diferença entre largura (width) e altura (height).
2. Resumo teórico
O recurso @media (max-width: 600px) cria uma regra condicional: o CSS dentro dela só será aplicado se a largura da tela for igual ou menor que 600 pixels. Já a propriedade flex-direction: column faz com que os itens dentro de um container flex sejam organizados na vertical. Para referência, veja a documentação oficial do MDN.
3. Justificativa da alternativa correta
A alternativa C descreve corretamente a função do comando: quando a largura da tela chega a até 600px, o container chamado .container passa a alinhar seus elementos verticalmente, tornando o site mais adaptável para telas menores, como celulares. Isso é o objetivo do design responsivo via Media Queries.
4. Análise das alternativas incorretas
A – Erro conceitual: o comando se refere à largura, não à altura do elemento.
B – Generalização inadequada: não é para qualquer dispositivo móvel e sim apenas para aqueles cuja largura é ≤600px.
D – Confusão de propriedades: o comando não define largura, mas a direção dos elementos flexíveis.
E – Inversão da condição: a regra só vale para larguras menores ou iguais a 600px, não para valores acima disso.
5. Estratégias para interpretação
Leia atentamente se a regra trata de largura (width) ou altura (height), e se o valor é menor, maior ou igual ao especificado. Palavras como “sempre”, “qualquer”, “exatamente” devem ser verificadas com cautela, pois costumam indicar exageros ou erros conceituais.
Gostou do comentário? Deixe sua avaliação aqui embaixo!
Clique para visualizar este gabarito
Visualize o gabarito desta questão clicando no botão abaixo
Comentários
Veja os comentários dos nossos alunos
Resposta C
- A ❌ A condição é sobre largura da tela, não altura.
- B ❌ Não é “qualquer dispositivo móvel”; depende da largura da viewport.
- D ❌ A media query não define largura, apenas aplica estilos condicionais.
- E ❌ significa “até 600px” — não acima.
Clique para visualizar este comentário
Visualize os comentários desta questão clicando no botão abaixo