并排的href（图片）没有响应

Question

我正在创建2 a href，我为此使用图像，该图像并排并且需要响应。但是问题是当我在电话中查看它时，它没有响应。不同角度的href位置。下面是我的代码。我希望href图像并排并使其具有响应性。

HTML

<meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<section id="new">



<header>
  <div class="container">
    <div class="row">

    <div class="col-sm-6">
     <img class="img-responsive" src="1.png" alt="">
    </div>
    <div class="col-sm-6 text-center">
      <h2>You get detailed feedback from attendees</h2>
      <p class="lead">We provide unique insights & analytics into who attended, their engagement, and their review of your event.
      </p>


    </div>

    <div class="col-6 col-sm-3"><a href="#"   >
            <img id="app" src="app-store-badge.png"/>

          </a>
</div>
  <div class="col-6 col-sm-3"><a href="#"   >
            <img id="app" src="app-store-badge.png"/>

          </a>
</div>

    </div>
  </div>
</header>



</section>

CSS

<style type="text/css">
  .title{
  color:#00BD8B; margin-top: -180%; font-weight: bold; 
}
#bg {
  position: fixed; 
  top: 0; 
  left: 0; 

  /* Preserve aspet ratio */
  min-width: 100%;
  min-height: 100%;
}
.row {

  color: #fff;
}



</style>