html - How to make image responsive -
i trying make image responsive.in web version looks when trying see image in mobile version it's not in responsive .please me find out solution..
here html code
<html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="banner-bg"> <div class="banner-bg-item"><img src="img/banner-bg-1.jpg" style="max-width: 100%;" alt=""></div> <div class="banner-bg-item"><img src="img/banner-bg-2.jpg" style="max-width: 100%;" alt=""></div> <div class="banner-bg-item"><img src="img/banner-bg-3.jpg" style="max-width: 100%;" alt=""></div> <div class="banner-bg-item"><img src="img/banner-bg-4.jpg" style="max-width: 100%;" alt=""></div> </div> </body> </html>
and css file
#banner .banner-bg .banner-bg-item .img{ max-width: 100%;height: auto;display:block;width:100%; }
i try using bootstrap , make image class img-responsive not working..so please me find solution
instead of max-width, put these two:
<img width=100% height=100% />
Comments
Post a Comment