链接无法在bootstrap xs上工作

时间:2015-10-07 15:45:45

标签: css twitter-bootstrap

我重复下面的div使用bootstrap 3创建一个缩略图网格。问题是锚链接不能在xs上工作(既不是按钮也不是图像链接),但它们可以在sm,md和LG。

<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
  <div class="thumbnail" style="height:520px;">
    <a href="/movies/4539/burnt-offerings-1976"><img src="https://s.ynet.io/assets/images/movies/burnt_offerings_1976/medium-cover.jpg" alt="Burnt Offerings"></a>
    <div class="caption">
      <h5>Burnt Offerings</h5>
      <dl class="dl-horizontal hidden-xs">
        <dt>Year</dt><dd>1976</dd>
        <dt>Rating</dt><dd>6.5</dd>
        <dt>Runtime</dt><dd>1:56</dd>
      </dl>
      <p><a href="/movies/4539/burnt-offerings-1976" class="btn btn-primary btn-sm btn-block">Download</a></p>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:1)

您的ul.pager涵盖col-xs上的所有元素,因此无需点击任何内容。

这是一个想法:

ul.pager添加z-index: 1;<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">上添加另一个您可以加入的课程<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3 item">并执行.item { position: relative; z-index: 2; }