Twitter bootstrap 3 自举柱折叠

我知道Bootstrap3有一个12列的网格系统。我的理解是，任何超过12列的内容都应该堆叠在下一行。为什么我的专栏会把3张图片放在顶部，2张图片放在中间，1张放在底部

这是我的代码和链接。如果调整浏览器宽度，可以看到：

<div id="Portfolio" class="container">
    <div class="row">
        <div class="col-md-4">
            <a href="http://www.gizmoticket.jitsu.com">
                <img class="img-responsive" src="img/gizmo.png" alt="Gizmo Ticket">
            </a>
            <h4>Gizmo Ticket System &#8211; Ajax, EJS, node.js, MongoDB &#8211; </h4>
        </div>      

        <div class="col-md-4">
            <a href="http://www.spataforeguitar.com">
                <img class="img-responsive" src="img/guitar.png" alt="Spatafore Guitar">    
            </a>
            <h4>Spatafore Guitar Instruction &#8211; HTML5, responsive, jQuery</h4>
        </div>

        <div class="col-md-4">
            <a href="http://lyfia.freeiz.com/index.php">
                <img class="img-responsive" src="img/lyfia.png" alt="Lyfia Massage">
            </a>
            <h4>Lyfia Massage Therapy &#8211; Bootstrap, responsive, jQuery</h4>
        </div>

        <div class="col-md-4">
            <a href="https://individualinvestor.myleggmason.com/portal/server.pt?open=514&amp;objID=77504&amp;mode=2&amp;in_hi_userid=355661&amp;cached=true">
                <img class="img-responsive" src="img/esg.png" alt="ESG">
            </a>
            <h4>Legg Mason-ESG Feature &#8211; jQuery, Amazing Slider</h4>
        </div>

        <div class="col-md-4">
            <a href="http://www.leggmason.co.uk/income/">
                <img class="img-responsive" src="img/income.png" alt="Income Campaign">
            </a>
            <h4>Legg Mason-Income Feature &#8211; jQuery, Amazing Slider</h4>
        </div>

        <div class="col-md-4">
            <a href="https://dl.dropboxusercontent.com/u/92838694/Final%20Project/mage.html">
                <img class="img-responsive" src="img/warcraft.png" alt="Warcraft">
            </a>
            <h4>School Project &#8211; HTML5 audio, Adaptive</h4>
        </div>
    </div>
</div>

Gizmo票务系统–；Ajax、EJS、node.js、MongoDB–；
斯帕塔福吉他教学&8211；HTML5，响应式，jQuery
Lyfia按摩疗法–；引导、响应、jQuery
Legg-Mason ESG功能部件–；jQuery，惊人的滑块
莱格·梅森收入特征–；jQuery，惊人的滑块
学校项目–；HTML5音频，自适应

这里是链接：请看我的答案：谢谢。添加“clearfix可见md块”似乎已经修复了它。