html - 基础网格不工作。3列布局？

Question

我用过Foundation很多次，一切正常。我正在尝试在页脚上方做三列，它似乎太大了：http: //1stcallwebdesign.com/tracsoft/

<div class="row">
    <div class="twelve columns"> 
        <div class="four columns">
            <h2>Our Clients</h2>

        </div> 
        <div class="four columns">
            <h2>Blog</h2>

        </div> 
        <div class="four columns last">
            <h2>Expertise</h2>

        </div> 
    </div>
</div> 

它应该是 3 个完美的列。4x3=12。但是柱子似乎太大了，把最后一个推下来了。有任何想法吗？

编辑：页脚中发生了同样的事情。四列，最后一列被推。我知道我可以减少列的宽度，但这会弄乱整个网格。它应该可以工作。

Answer 1

请查看http://1stcallwebdesign.com/tracsoft/css/global.css

.column, .columns {
    float: left;
    min-height: 1px;
   /* padding: 0 15px;*/ /*this will do*/
    position: relative;
}

或者你可以做

.four, .row .four {
    width: 30.333%;
}

Answer 2

使用您的代码：

.four, .row .four {
width: 30.33333%;
}

减小宽度。然后你的问题就解决了...