我正在网站上工作 http://westlinebuilders.com , 这是我的代码
<div class="row allprj">
<div class="span4">
<figure class="frame thumbnail alignnone clearfix">
<a title="Permanent Link to THE PRESIDENTIAL SUITES" href="http://westlinebuilders.com/portfolio-view/the-presidential-suites/" class="image-wrap"><img alt="THE PRESIDENTIAL SUITES" src="http://westlinebuilders.com/wp-content/uploads/2014/07/Westline-Falnir_03-W-.jpg"></a>
</figure>
<div style="margin-top: -10px; padding: 0 0 15px;" class="service-box extra">
<div class="service-box_body">
<h2 class="title">
<a title="Permanent Link to THE PRESIDENTIAL SUITES" href="http://westlinebuilders.com/portfolio-view/the-presidential-suites/" class="extra2" style="font-size: 26px !important">THE PRESIDENTIAL SUITES</a>
</h2>
<h5 class="sub-title">
Falnir
</h5>
</div>
</div>
</div>
<div class="span4 prj">
<figure class="frame thumbnail alignnone clearfix">
<a class="image-wrap" href="http://westlinebuilders.com/signature" title="Permanent Link to Westline Signature"><img src="http://westlinebuilders.com/wp-content/uploads/2014/07/signature-42.jpg" alt="Signature"></a>
</figure>
<div style="margin-top: -10px; padding: 0 0 15px;" class="service-box extra">
<div class="service-box_body">
<h2 class="title">
<a class="extra2" href="http://westlinebuilders.com/signature" title="Permanent Link to Signature" style="font-size: 26px !important">Signature</a>
</h2>
<h5 class="sub-title">
Nanthoor Junction
</h5>
</div>
</div>
</div>
<div class="span4">
<figure class="frame thumbnail alignnone clearfix">
<a title="Permanent Link to Skydale" href="http://westlinebuilders.com/portfolio-view/westline-skydale/" class="image-wrap"><img alt="Skydale" src="http://westlinebuilders.com/wp-content/uploads/2014/04/West-lineBKN-Pool1_01-420x247.jpg"></a>
</figure>
<div style="margin-top: -10px; padding: 0 0 15px;" class="service-box extra">
<div class="service-box_body">
<h2 class="title">
<a title="Permanent Link to Skydale" href="http://westlinebuilders.com/portfolio-view/westline-skydale/" class="extra2" style="font-size: 26px !important">Skydale</a>
</h2>
<h5 class="sub-title">
Bikkarnakatte
</h5>
</div>
</div>
</div>
<div class="span4">
<figure class="frame thumbnail alignnone clearfix">
<a title="Permanent Link to Fairmont" href="http://westlinebuilders.com/portfolio-view/westline-fairmont-kadri-mangalore-apartments-flats/" class="image-wrap"><img alt="Fairmont" src="http://westlinebuilders.com/wp-content/uploads/2011/07/fairmont.jpg"></a>
</figure>
<div style="margin-top: -10px; padding: 0 0 15px;" class="service-box extra">
<div class="service-box_body">
<h2 class="title">
<a title="Permanent Link to Fairmont" href="http://westlinebuilders.com/portfolio-view/westline-fairmont-kadri-mangalore-apartments-flats/" class="extra2" style="font-size: 26px !important">Fairmont</a>
</h2>
<h5 class="sub-title">
Kadri
</h5>
</div>
</div>
</div>
<div class="span4">
<figure class="frame thumbnail alignnone clearfix">
<a title="Permanent Link to Splendid Homes" href="http://westlinebuilders.com/portfolio-view/splendid-homes/" class="image-wrap"><img alt="Splendid Homes" src="http://westlinebuilders.com/wp-content/uploads/2013/03/Westline-Kulshekara_small-420x247.jpg"></a>
</figure>
<div style="margin-top: -10px; padding: 0 0 15px;" class="service-box extra">
<div class="service-box_body">
<h2 class="title">
<a title="Permanent Link to Splendid Homes" href="http://westlinebuilders.com/portfolio-view/splendid-homes/" class="extra2" style="font-size: 26px !important">Splendid Homes</a>
</h2>
<h5 class="sub-title">
Kulshekar
</h5>
</div>
</div>
</div>
<div class="span4">
<figure class="frame thumbnail alignnone clearfix">
<a title="Permanent Link to Bonita" href="http://westlinebuilders.com/portfolio-view/westline-bonita-thokkottu-apartments-flats-mangalore/" class="image-wrap"><img alt="Bonita" src="http://westlinebuilders.com/wp-content/uploads/2011/07/bonita.jpg"></a>
</figure>
<div style="margin-top: -10px; padding: 0 0 15px;" class="service-box extra">
<div class="service-box_body">
<h2 class="title">
<a title="Permanent Link to Bonita" href="http://westlinebuilders.com/portfolio-view/westline-bonita-thokkottu-apartments-flats-mangalore/" class="extra2" style="font-size: 26px !important">Bonita</a>
</h2>
<h5 class="sub-title">
NH66, Thokkottu
</h5>
</div>
</div>
</div>
</div>
，我与 6 排在一起，但是当您调整浏览器窗口大小时，第四个 div 会下降。我也试过<div class="row-fluid">但运气不好，有人可以帮我解决这个问题吗？
最佳答案
嗯，看起来这实际上不是第四个被下推的元素 - 事实上，它是被推到新行的第六个(调整浏览器大小时请注意内容)。
这的直接原因是第一个元素中的标题 总统套房 使该元素比它的兄弟元素高，导致它下面的元素(第四个)被移过来，并最终将第六项强制换行。
但根本问题是，您正尝试使用 .span4 容器可视化地创建两行，但它们周围只有一个 .row 容器.如果您想要使用此框架的两行，请使用两个 .row 容器。因此，而不是你目前拥有的 HTML 结构:
<div class="row allprj">
<div class="span4">
...
</div>
<div class="span4 prj">
...
</div>
<div class="span4">
...
</div>
<div class="span4">
...
</div>
<div class="span4">
...
</div>
<div class="span4">
...
</div>
</div>
您应该将内容分成两个 .row 容器:
<div class="row allprj">
<div class="span4">
...
</div>
<div class="span4 prj">
...
</div>
<div class="span4">
...
</div>
</div>
<div class="row allprj">
<div class="span4">
...
</div>
<div class="span4">
...
</div>
<div class="span4">
...
</div>
</div>
希望对您有所帮助!如果您有任何问题，请告诉我。
关于html - 第四行溢出 Twitter Bootstrap，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24816995/