html - 向下滚动页面后链接变得无法点击

Question

直到昨天，我的链接一直正常工作。但是，我刚刚发现，如果我通过鼠标或“Page Down”向下滚动页面，我的链接无法被点击。

它似乎可以在 Chrome 和 Firefox 的移动版本上正常工作，但不能在笔记本电脑/计算机上正常工作。

可能是什么问题？

header-middle .container .row .col-sm-4 {
  padding-left: 0;
}
.product-image-wrapper{
border:1px solid #F7F7F5;
overflow: hidden;
margin-bottom:30px;
}
.single-products {
 position: relative;
}
.productinfo{
width: 100%;
height: 265px;
overflow: hidden;
}
.productinfo img{
 display: inline-block;
 vertical-align: middle;
 height: 130px;
 width: auto;
 overflow: hidden;
}
.productinfo h5{
text-overflow: ellipsis;
word-wrap: break-word;
overflow: hidden;
height: 2.2em;
line-height: 1.1em;
}
.productinfo h2{
color: #FE980F;
font-family: 'Roboto', sans-serif;
font-size: 24px;
font-weight: 700;
}
.add-to-cart {
background:#F5F5ED;
border: 0 none;
border-radius: 0;
color: #696763;
font-family: 'Roboto', sans-serif;
font-size: 15px;
margin-bottom: 25px;
}

<div class="col-sm-4">
  <div class="product-image-wrapper">
    <div class="single-products">
      <div class="productinfo text-center">
        <img src="#" alt="#">
        <h2>price</h2>
        <h5>title</h5>
        <a href="#" target=_blank class="btn btn-default add-to-cart">
          <i class="fa fa-shopping-cart"></i>
          click now
        </a>
      </div>
    </div>
  </div>
</div>

Answer 1

我会尝试两件事。

1.) 删除 <i> 的使用标记并替换为 <span>

检查一下: Should I use <i> tag for icons instead of <span>?

2.) 您没有公开所有代码。但也许你正在经历 z-index问题;尝试设置 z-index:至 z-index: 1001;在你的 .btn类(或任何 z-index 值有效)

Note:// 此外，在 <a> 上使用这么多类似乎有点奇怪标签。你，应该试着清理一下。

如果您发布完整的代码，我们会在这里更加准确。