Ahora, si ponemos flex-grow: 1 en ambos elementos, ¿Qué pasaría? ¿Cuál seria el tamaño del elemento 1? Y el elemento 2?
Elemento 1: 200 px.
Elemento 2: 200 px.
Espacio vacío que restó del flex container: 600 px, cada elemento pasaría a medir 500px, dividendo el total del espacio disponible
¡Hola César!
Si aplicamos flex-grow: 1 a ambos elementos, significa que ambos elementos tendrán la misma capacidad para crecer y ocupar el espacio disponible en el contenedor.
En este caso, si el elemento 1 tiene un tamaño inicial de 200px y el elemento 2 también tiene un tamaño inicial de 200px, y el espacio vacío restante en el contenedor es de 600px, entonces ambos elementos se dividirían equitativamente ese espacio disponible.
Por lo tanto, cada elemento pasaría a medir 500px, ya que se dividiría el total del espacio disponible (600px) entre los dos elementos.
Espero que esta respuesta resuelva tu duda. ¡Espero haber ayudado y buenos estudios!