How to make the images on your website responsive using CSS

If you are working on a responsive website and you have lot of images on your website which you would like to automatically adjust according to the medium being used to browse the page then please add the following class to your CSS file.

.img-responsive {
    display:block;
    max-width:100%;
    height:auto;
}

Now apply the above class to all img tags on your website.


Now browse the same website on your desktop as well as mobile and you will see that the images are not automatically adjusting their width according to the medium.

Hope the above helped.

Please follow and like us:

Be the first to comment

Leave a Reply

Your email address will not be published.


*