html - Bootstrap 3 .img 响应图像不是链接内的响应图像

Question

我在使用 Bootstrap 3 时遇到了问题。我的某些行中的图像响应正常，但在 insta 和 vk 上带有链接的图像没有响应。图片大小为40x40

代码如下

.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>

谢谢大家的帮助!

Answer 1

因为a元素默认是display: inline;。将 a 元素设置为 display: inline-block; 或 display: block;。