Le di a mi clase de imagen "img-fluid" en Bootstrap pero no se ajusta a mi página web, ¿qué debo hacer?
<img src="images\406201.jpg" class="img-fluid" alt="..."> <div style="margin-top: 0px ;margin-left: 12px; width: 98.4%;" class="footer bg-dark text-light p-5"> <h3 style="text-align: center;">follow Us</h3> <div class="d-flex justify-content-center flex-wrap"> <a href="#"><img style="width: 65px; margin: 2px;border-radius: 5px;" src="images/facebook-logo.png" class="bg-light" alt="..."></a> <a href="#"><img style="width: 65px; margin: 2px;border-radius: 5px;" src="images\twitter-logo.png" class="bg-light" alt="..."></a> <a href="#"><img style="width: 65px; margin: 2px;border-radius: 5px;" src="images\instagram-logo-png-transparent-0.png" class="bg-light" alt=""></a> <a href="#"><img style="width: 65px; margin: 2px;border-radius: 5px;" src="images\telegram-logo-png-0.png" class="bg-light" alt=""></a> </div> <h4 style="text-align: center; margin-top: 15px;">Powered by Marvel Studious</h4> </div>Cuando le doy style="width=100%" funciona, pero el problema es que no necesita CSS.
No estoy seguro si este es el problema, pero img-fluid pone la imagen en el tamaño máximo posible dado el lugar donde se encuentra, por ejemplo, si está dentro de un div , la imagen tendrá el tamaño del div y no el pantalla, así que asegúrese de no tener la imagen dentro de algo que esté limitando su tamaño
Ponga la imagen en un div con clase "container-fluid".
<style> .width-complete{ width:100% } </style> <div class="container-fluid"> <img src="images\406201.jpg" class="width-complete" alt="..."> </div>