Solucionado
Hola, mi duda es, si al aplicar la propiedad flex, los elementos se adaptan al espacio del contenedor padre, entonces porque las propiedades como justify-contex, space-between, space-around alteran este comportamiento cuando no se tiene 4 elementos.
Gracias
Así es. Al aplicar "display: flex;" y posteriormente las demás propiedades, los elementos se van a adaptar de acuerdo la propiedad seleccionada y cantidad de elementos dentro de la clase padre.
¿Se entendió?
La propiedad flex nos permite acomadar elementos dentro de un contenedor. Por defecto, inicia en flex-direction:row; y alineados a la izquierda. Precísamente, podemos cambiar el valor por defecto que tienen los elementos flex direction, justify-content y align items para acomodar los elementos a nuestro gusto.
Hay muchas razones por las cuáles el resultado puede no ser el esperado. Usualmente cuando hay varios elementos, estos pueden exceder el tamaño del contenedor en el que se encuentran, y comandos comoflexwrap y overflow podrían ayudarnos a alcanzar el comportamiento deseado. Te recomiendo que investigues a fondo flexbox, ya que, aunque es un tema aparentemente sencillo, es bastante largo