我正在尝试使用行和列但是它不起作用，没有创建新行，它只是在开始新行之前填充行的宽度。我用chrome和safari尝试过它，但它们都没有用。
<div class="container">
<div class="row" id='bsoon'>
<div class="col-lg-3 col-md-3 thumbs item-thumbs bedroomcloset mattress chair accessory">
<p>Coming soon</p>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<h3>The City</h3>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheCity</div>
<a class="hover-wrap fancybox" id="fbox" rel="city" title="The City" href="_include/img/work/full/image-01-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img align="middle" src="_include/img/work/thumbs/image-01.jpg" alt="This kitchen features unadorned minimalism that’s fresh, relaxing and welcoming thanks to the white and yellow glossy paint. Handless drawers and Doors with soft opening and closing mechanism enabling drawers to open and shut smoothly." style="margin-top:-60px">
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheCity</div>
<a class="hover-wrap fancybox" rel="city" title="The City" href="_include/img/work/full/image-08-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-08.jpg" alt="This kitchen features unadorned minimalism that’s fresh, relaxing and welcoming thanks to the white and yellow glossy paint. Handless drawers and Doors with soft opening and closing mechanism enabling drawers to open and shut smoothly.">
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheCity</div>
<a class="hover-wrap fancybox" rel="city" title="The City" href="_include/img/work/full/image-08-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-08.jpg" alt="This kitchen features unadorned minimalism that’s fresh, relaxing and welcoming thanks to the white and yellow glossy paint. Handless drawers and Doors with soft opening and closing mechanism enabling drawers to open and shut smoothly.">
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<h3>The Executive</h3>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheExecutive</div>
<a class="hover-wrap fancybox" rel="exec" title="The Executive" href="_include/img/work/full/image-02-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-02.jpg" alt="The perfect contrast of graphite mirror-like doors with the warmth of Ebony veneer made even more stunning with the two-level black and (glow-in-the-dark) worktops, where the island brings the working surface close to the family, and sets the scene on center stage: seating at the grey metallic bar is symbolic of a new togetherness.">
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheExecutive</div>
<a class="hover-wrap fancybox" rel="exec" title="The Executive" href="_include/img/work/full/image-09-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-09.jpg" alt="The perfect contrast of graphite mirror-like doors with the warmth of Ebony veneer made even more stunning with the two-level black and (glow-in-the-dark) worktops, where the island brings the working surface close to the family, and sets the scene on center stage: seating at the grey metallic bar is symbolic of a new togetherness.">
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<h3>The Arctic</h3>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheArctic</div>
<a class="hover-wrap fancybox" rel="arc" title="The Arctic" href="_include/img/work/full/image-05-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-05.jpg" alt="A kitchen of pure fashion creativity. A functional design without handles, with full extension drawer slides to avoid excess bending. The mirror- like blue arcylic tall units communicate with the zebrano laminate elements, creating a combination of closed and open shelves.">
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheArctic</div>
<a class="hover-wrap fancybox" rel="arc" title="The Arctic" href="_include/img/work/full/image-06-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-06.jpg" alt="A kitchen of pure fashion creativity. A functional design without handles, with full extension drawer slides to avoid excess bending. The mirror- like blue arcylic tall units communicate with the zebrano laminate elements, creating a combination of closed and open shelves.">
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<h3>The Vavona</h3>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 thumbs item-thumbs kitchen">
<div class="name" hidden>TheVavona</div>
<a class="hover-wrap fancybox" rel="vavona" title="The Vavona" href="_include/img/work/full/image-03-full.jpg">
<span class="overlay-img"></span>
<span class="overlay-img-thumb font-icon-plus"></span>
</a>
<img src="_include/img/work/thumbs/image-03.jpg" alt="Power through contrast, when very different refined materials and original colours enter into symbiosis, big things happen. The island is enhanced with a black top accommodating a ceramic hob and a hood in the center of the room where you can enjoy the experience of cooking in the atmosphere of fresh orange colour, brown metallic laminate and the exotic Vavona wood!!">
</div>
</div>
</div>
修改
我在检查时发现有些内容会添加以下内联样式，从而导致出现问题
position: absolute;
left: 0px;
top: 0px;
transform: translate3d(0px, 0px, 0px);
答案 0 :(得分：0)
试一试。它创建了4行4列（如果这就是你要找的东西）。
<div class="container">
<div class="row">
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
</div>
<div class="row">
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
</div>
<div class="row">
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
</div>
<div class="row">
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
<div class="col-sm-3">Text here</div>
</div>
</div>
修改
确保在标题<head>内有此内容。
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r"
crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
crossorigin="anonymous"></script>
答案 1 :(得分：-1)
整个问题来自isotope.js布局模式，它强制元素适合行
解决方案是创建一个'none'布局模式元素并将其分配给同位素
var NoneMode = Isotope.LayoutMode.create('none');
$container.isotope({
layoutMode: 'none',
});