Bootstrap 3 .img-responsive images are not responsive images inside links

Question

I am use Bootstrap 3 and have a problem. Some of my images in row responsive normal, but images with links on insta and vk are not responsive. The size of images are 40x40

Code below

 .navbar-default-footer { background-color: white; text-align: center; margin-bottom: 0; } div.col-lg-4.col-md-4.col-xs-4 img { margin-left: auto; margin-right: auto; display: inline; } .footer_text { font-size: 5px; color: #708090; margin-bottom: 0px; } 

 <nav class="navbar navbar-default-footer" role="navigation"> <div class="container-fluid"> <div class="row"> <div class="col-lg-4 col-md-4 col-xs-4"> <img src="images/Originals/example2.jpg" class="img-responsive"> </div> <div class="col-lg-4 col-md-4 col-xs-4"> <a href="#" data-toggle="tooltip" data-placement="left" title="Ищи меня в Instagram"><img src="images/insta_40x40.jpg" class="img-responsive"></a> <a href="#" data-toggle="tooltip" data-placement="right" title="Ищи меня VK"><img src="images/vk_40x40.jpg" class="img-responsive"></a> </div> <div class="col-lg-4 col-md-4 col-xs-4"> <img src="images/Originals/example2.jpg" class="img-responsive"> </div> </div> <div class="container"> <div class="row"> <div class="col-lg-12 col-md-12 col-xs-12"> <p class="footer_text"> Свадебные прически в Виннице. Людмила Кулик. Все права защищены, любое копирование и использование материала запрещено без согласия автора.</p> </div> </div> </div> </div> </nav> 

Thanks all for help!

Answer 1

It's because a elements are display: inline; by default. Set the a elements to be display: inline-block; or display: block; .