1. Flex-grow refere-se à expansão da largura ocupada pelos itens flexíveis. O espaço expandido é o espaço em branco restante após a exclusão dos elementos.
2. Valores negativos não são suportados O valor padrão é 0, o que significa que o espaço em branco restante não será ocupado para expandir sua largura.
Se flex-grow for maior que 0, ocorrerá a alocação do espaço restante no flex container.
Exemplo
//parte HTML <div>
<div></div>
<div></div>
<div></div>
</div>
//CSS parte.caixa{
largura: 600px;
altura: 200px;
borda: 1px sólido;
exibição: flexível;
}
.box div:enésimo-do-tipo(1){
largura: 100px;
altura: 100px;
cor de fundo: vermelho;
}
.box div:enésimo-do-tipo(2){
largura: 150px;
altura: 100px;
cor de fundo: azul celeste;
}
.box div:enésimo-do-tipo(3){
largura: 200px;
altura: 100px;
cor de fundo: amarelo;
}O texto acima é uma introdução ao atributo flex-grow em CSS. Espero que seja útil para todos.