Skip to content

Latest commit

 

History

History
25 lines (17 loc) · 1.09 KB

1-Flex-Grow.md

File metadata and controls

25 lines (17 loc) · 1.09 KB

1 • flex-grow

Define a habilidade de um flex item crescer. Por padrão o valor é zero, assim os flex itens
ocupam um tamanho máximo relacionado ao conteúdo interno deles ou ao width definido.

Ao definir 1 para todos os Flex itens, eles tentarão ter a mesma largura e vão ocupar 100% do container.
Digo tentarão pois caso um elemento possua um conteúdo muito lardo, ele ira respeitar o mesmo.

Se você tiver uma linha com quatro itens, onde três são flex-grow: 1 e um flex-grow:2, o flex-grow:2
tentará ocupar 2 vezes mais espaço extra do que os outros elementos.

OBS: justify-content não funciona em items com flex-grow definido.

flex-grow: número;
// Basta definir um número
flex-grow: 0;
// Obedece o width do elemento ou o flex-basis.

Veja também em:

• LINK AQUI