我重复下面的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>
答案 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; }