1. Flex-grow se refiere a expandir el ancho ocupado por elementos flexibles. El espacio expandido es el espacio en blanco restante después de excluir los elementos.
2. No se admiten valores negativos. El valor predeterminado es 0, lo que significa que el espacio en blanco restante no se ocupará para expandir su ancho.
Si flex-grow es mayor que 0, se asignará el espacio restante en el contenedor flexible.
Ejemplo
// parte HTML <div> <div></div> <div></div> <div></div> </div> // CSS part.box{ ancho: 600px; altura: 200 píxeles; borde: 1px sólido; pantalla: flexible; } .box div: enésimo tipo (1) { ancho: 100px; altura: 100 píxeles; color de fondo: rojo; } .box div: enésimo tipo (2) { ancho: 150 px; altura: 100 píxeles; color de fondo: azul cielo; } .box div: enésimo tipo (3) { ancho: 200px; altura: 100 píxeles; color de fondo: amarillo; }
Lo anterior es una introducción al atributo flex-grow en CSS. Espero que sea útil para todos.