html - 当分辨率改变时使面板进入新行

Question

我有几个面板工作正常但是当我调整浏览器大小时它们看起来不太正确，我想要这样的东西:

|1|  |2|  |3|  |4|
|5|  |6| 

然后当浏览器调整大小时它应该去

|1|  |2|  |3|
|4|  |5|  |6|

但是用当前的代码它是这样做的

|1|  |2|  |3|
          |4|

这是我的代码:

<div class="col-sm-6 col-md-4 col-lg-3">
    <div class="panel panel-default">
        <div class="panel-heading"><strong><a href="index.php?page=portfolio&work=driveways">Driveways</a></strong></div>
            <div class="panel-body">
                Blockpaving<br />
                Indian stone<br />
                Shingle<br />
                Concrete<br />
                Crossovers<br />
                Drainage<br />
                Drive Cleaning<br />
            </div>
        </div>
</div>

<div class="col-sm-6 col-md-4 col-lg-3">
    <div class="panel panel-default">
        <div class="panel-heading"><strong><a href="index.php?page=portfolio&work=patios">Patios</a></strong></div>
            <div class="panel-body">
                Slabs<br />
                Indian stone<br />
                York stone<br />
                Brick surrounds<br />
                Drainage<br />
            </div>
        </div>
</div>

<div class="col-sm-6 col-md-4 col-lg-3">
    <div class="panel panel-default">
        <div class="panel-heading"><strong><a href="index.php?page=portfolio&work=paths">Paths</a></strong></div>
            <div class="panel-body">
                Blockpaving<br />
                Slab<br />
                Indian stone<br />
                Concrete<br />
            </div>
        </div>
</div>

<div class="col-sm-6 col-md-4 col-lg-3">
    <div class="panel panel-default">
        <div class="panel-heading"><strong><a href="index.php?page=portfolio&work=decking">Decking</a></strong></div>
            <div class="panel-body">
                Timber<br />
                Composite<br />
                Balustrades<br />
                Steps<br />
                Pergolas<br />
                Shed/Bar Conversions<br />
            </div>
        </div>
</div>

截图如下:

Answer 1

在第3 block 和第4 block div之前添加:

<div class="clearfix visible-md-block"></div>

http://getbootstrap.com/css/#grid-responsive-resets