En un sitio web, las imágenes no responden ... al acercar o alejar las imágenes, no se cambia el tamaño correctamente. ¿Cómo solucionar este problema? ¿Cuál podría ser la causa raíz y la posible solución a esto?
En realidad, hay una buena referencia a la que puede consultar cuando necesite crear imágenes receptivas.
W3schools responsive: imágenes responsivas
.responsive { width: 100%; height: auto; } <img src="image.jpg" alt="image" class="responsive">La mejor práctica es dar max-width al contenedor de imagen div y width a la imagen. Por ejemplo:
.img-container { max-width: 50%; height: 400px; } img { width: 100%; height: auto; }Además, verifique si ha agregado la etiqueta meta correctamente.
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">