Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Disminuyendo proporcionalmente los elementos

  1. Cuando el ancho de la pantalla llega a 800 px, los elementos mantienen 200 px de ancho cada uno llenando todo el espacio de la pantalla, sin embargo, qué pasa con el ancho de los flexItem cuando disminuimos la pantalla a por ejemplo 600 px.

se mantendrá un ancho fijo, se reducirán los div de manera equitativa cuando la pantalla se haga pequeña.

  1. ¿Qué ocurre también con su ancho cuando aplicamos el siguiente CSS a nuestro código?

el prime div se encogerá más rápido que los demás

1 respuesta

¡Hola César!

Cuando disminuyes el ancho de la pantalla a 600 px, si has configurado los elementos flexibles con un ancho fijo de 200 px cada uno, lo más probable es que los elementos se reduzcan proporcionalmente para ajustarse al nuevo tamaño de la pantalla. Esto significa que cada elemento se hará más pequeño de manera equitativa para llenar el espacio disponible.

En cuanto a la segunda pregunta, si aplicas CSS para hacer que el primer div se encoga más rápido que los demás, puedes lograrlo utilizando la propiedad flex-shrink. Por ejemplo, si estableces flex-shrink: 2 en el primer div y flex-shrink: 1 en los demás divs, el primer div se reducirá el doble de rápido que los otros divs cuando la pantalla se haga más pequeña.

Espero que esto resuelva tus dudas. ¡Si tienes alguna otra pregunta, no dudes en hacerla! ¡Espero haber ayudado y buenos estudios!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios! :)