Questão FC374842
O desenvolvedor da SEMCONGER precisa criar uma página dinâmica utilizando HTML, CSS e JavaScript para um sistema interno de gerenciamento de contratos. Ele deseja utilizar CSS para
Desenvolvimento Web
Instituto Consulplan · 2025
O desenvolvedor da SEMCONGER precisa criar uma página dinâmica utilizando HTML, CSS e JavaScript para um sistema interno de gerenciamento de contratos. Ele deseja utilizar CSS para definir o layout responsivo e JavaScript para interatividade.
A seguir está um trecho do código HTML com CSS embutido:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contratos</title>
<style>
.container {
display: ___________;
justify-content: center;
align-items: center;
height: 100vh;
}
</style>
</head>
<body>
<div class="container">
<h1>Gerenciamento de Contratos</h1>
</div>
</body>
</html>
Assinale a alternativa que preenche corretamente a lacuna no código CSS, para que o div.container centralize o conteúdo tanto na horizontal quanto na vertical.
- flex
- grid
- block
- inline-block
Mostrar resposta e comentário
Gabarito
A
Comentário do professor
Ao usar display: flex na classe .container, o elemento torna-se um flex container, o que permite gerenciar o posicionamento dos filhos com propriedades específicas do Flexbox.
Com justify-content: center você alinha os itens ao longo do eixo principal (por padrão, horizontal), enquanto align-items: center alinha ao longo do eixo transversal (vertical). Juntas, essas regras centralizam o conteúdo tanto na horizontal quanto na vertical.
O uso de height: 100vh garante que o contêiner ocupe a altura total da janela, permitindo a centralização vertical efetiva. Para empilhar itens verticalmente, ajuste flex-direction: column.
Portanto, preencher a lacuna com flex é a escolha correta para ativar esse comportamento de centralização com as propriedades fornecidas.
Conteúdo do catálogo FC Concursos · Atualizado em