CSS - Imágenes q ocupen el 100% del div contenedor

 
Vista:
sin imagen de perfil
Val: 2
Ha aumentado su posición en 17 puestos en CSS (en relación al último mes)
Gráfica de CSS

Imágenes q ocupen el 100% del div contenedor

Publicado por Javier (1 intervención) el 07/01/2021 17:42:49
Hola buenas tardes por qué cuando hago q una imagen ocupe el 100% del div siempre me deja un pequeño espacio libre en la altura del div? o sea en ancho la imagen ocupa el 100% del ancho del contenedor, hasta ahí bien pero en altura el div contenedor es un poco más alto q la imagen. yo lo quiero es q la imagen ocupe el 100% tanto en altura como en anchura. Si le pongo un color de fondo al div se aprecia lo q os estoy comentando. este es el código q utilizo. A ver si alguien me podría ayudar, saludos

1
2
3
4
5
6
7
8
9
.contenedor{
width:100%;
height:auto;
}
 
.contendor img {
width:100%;
height:auto;
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de joel
Val: 870
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Imágenes q ocupen el 100% del div contenedor

Publicado por joel (252 intervenciones) el 07/01/2021 20:07:37
Hola Javier, una buena manera, es ponerla como fondo de pantalla, de esta manera, le puedes indicar que se distorsione para que ocupe todo el ancho y alto de su contenedor. https://www.lawebdelprogramador.com/codigo/CSS/2344-Anadir-una-imagen-de-fondo-de-pantalla-que-ocupe-todo-el-navegador-con-css3.html

Si lo quieres hacer con un <img>, simplemente tienes que poner el width y el height de la imagen 100% y la imagen se distorsionara para ponerse dentro de su contenedor.

Es esto lo que buscas?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Imágenes q ocupen el 100% del div contenedor

Publicado por German (1 intervención) el 15/09/2021 01:51:31
Hola Javier, muy seguramente a estas alturas ya habrás resuelto el problema, pero por si no, la explicación es esta:

La etiqueta <img> tiene un display "inline", y tu contenedor en condiciones normales tiene un display "block", por eso cuando se inserta una imagen (display: inline), dentro de un contenedor (display: block) queda ese espacio en la parte de abajo entre el contenedor y la imágen; lo resuelves así:

img {
width: 100%;
display: block;
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar
sin imagen de perfil

Imágenes q ocupen el 100% del div contenedor

Publicado por michiszt (1 intervención) el 02/02/2023 06:02:58
mil gracias por la solución!! me salvaste :D
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Gris

Imágenes q ocupen el 100% del div contenedor

Publicado por Gris (1 intervención) el 09/06/2023 23:19:32
Gracias muy util
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Imágenes q ocupen el 100% del div contenedor

Publicado por Me encanta tu canal (1 intervención) el 20/09/2023 06:21:23
En cantado broo
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar