我在页面上延伸了 4 个跨度,我想对前三个应用一口井。这将使井包裹在前 3 个跨度周围,为它们提供背景边距等...
我在第 4 个跨度之前使用了 ended the well div,但它仍然横跨页面,将第 4 个跨度移动到下方。是的,我可以将 css 应用于位置,但如果可能的话,我想避免。请参阅 bootply - http://bootply.com/71961
<div class="row-fluid">
<div class="well">
<ul class="thumbnails">
<li class="span3">
<div class="thumbnail searchthumb">
<a href="#"><img alt="200x200" src="http://placehold.it/200x200"></a>
</div>
</li>
<li class="span3">
<div class="thumbnail searchthumb">
<a href="#"><img alt="200x200" src="http://placehold.it/200x200"></a>
</div>
</li>
<li class="span3">
<div class="thumbnail searchthumb">
<a href="#"><img alt="200x200" src="http://placehold.it/200x200"></a>
</div>
</li>
</div>
<li class="span3">
<div class="thumbnail searchthumb">
<a href="#"><img alt="200x200" src="http://placehold.it/200x200"></a>
</div>
</li>
</ul>
</div>
最佳答案
一口井会添加填充,因此您必须小心使用它,否则可能会破坏网格,就像您的示例所发生的那样。
这是一个看起来很有希望的变体:http://bootply.com/71967
你会看到
- 我创建了一个新的 span9 列,其中包含一个新的井 div(以防止网格破裂)
- 在井内,我正在使用嵌套的行流体网格
- 我已将嵌套列更改为 span4(这是一个嵌套的行流体网格,因此它们加起来为 12)
- 您示例中的第四个 li 缺少其 ul 父级
祝你好运
关于html - Bootstrap well - 使用特定元素或宽度的井,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18055794/