Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Por Que o Flexbox Existe | Seção
Fundamentos de CSS

bookPor Que o Flexbox Existe

Deslize para mostrar o menu

Flexbox, abreviação de Flexible Box Layout, é um módulo CSS projetado para simplificar o alinhamento, a distribuição e a organização de elementos dentro de um contêiner.

Flexbox utiliza uma relação pai-filho. O pai é chamado de flex container, que controla o layout. Os filhos são chamados de flex items, cujos tamanhos, posições e ordens podem ser controlados utilizando propriedades do flexbox.

Note
Nota

O Flexbox se comporta de maneira diferente dos elementos de bloco e inline. Ao contrário dos elementos de bloco, os flex items não se empilham verticalmente; eles se alinham em uma linha ou coluna por padrão. Além disso, as margens nas bordas do contêiner não se estendem além de seus limites.

Flexbox em Ação

O Flexbox funciona alinhando itens ao longo dos eixos do flex container. Para habilitar o Flexbox, basta aplicar a propriedade display: flex; ao elemento pai. A partir daí, é possível personalizar como os itens se alinham e se distribuem dentro do contêiner.

index.html

index.html

index.css

index.css

copy
question mark

Em qual direção os itens flex são organizados por padrão?

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 1. Capítulo 14

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Seção 1. Capítulo 14
some-alt