Grupo de HTML y CSS
Este grupo esta relacionado con nuestro curso profesional de HTML y CSS. Aquí se comparten temas... View more
organizador:
- Organizado por
-
Web-responsive, flex item no es responsivo dentro de su contenedor padre.
Web-responsive, flex item no es responsivo dentro de su contenedor padre.
Hola, estoy trabajando un ejercicio de la mano con el curso en la parte web-responsive, llegué a un punto maquetando donde utilizando:
.flex-container{
display:flex;
flex-wrap: wrap;
}
Sobre mi caja contenedora el texto se ajusta y es responsivo mientras que la imagen no cambia de tamaño, el html del contenedor es el siguiente:
<div id=”vista2″ class=”flex-container”>
<div class: “texto”>lorem</div>
<div class: “img”>
</div></div>
Mi duda es, cómo hacer que la imagen se reduzca con el tamaño de la pantalla siendo que no es “afectada” por el flex en el contenedor padre.
- 3 Respuestas
Hola Eduardo,
Es necesario colocar un ancho del 100% a la imagen. Ejemplo: <img width=”100%”>
Me comentas si te funcionó.
Hola, efectivamente, tuve que utilizar un .class img{} en css y ahí agregué el width:100%.
Muchas gracias. ✌
Genial, recuerda que esto lo tienes que hacer en todas las imágenes para que tomen siempre el ancho de su contenedor. 😀