我在这里有一个工作代码：http:
//jsfiddle.net/WVm5d/（您可能需要使结果窗口更大才能看到对齐中心效果）

问题

代码工作正常，但我不喜欢display: table;. 这是我可以使 wrap-class 对齐中心的唯一方法。我认为如果有办法使用display: block;or会更好display: inline-block;。是否有可能以另一种方式解决对齐中心问题？

向容器添加一个固定的不是我的选择。

如果将来 JS Fiddle 链接被破坏，我还将在此处粘贴我的代码：

body {

    background: #bbb;

}



.wrap {

    background: #aaa;

    margin: 0 auto;

    display: table;

    overflow: hidden;

}



.sidebar {

    width: 200px;

    float: left;

    background: #eee;

}



.container {

    margin: 0 auto;

    background: #ddd;

    display: block;

    float: left;

    padding: 5px;

}



.box {

    background: #eee;

    border: 1px solid #ccc;

    padding: 10px;

    margin: 5px;

    float: left;

}



.box:nth-child(3n+1) {

    clear: left;

}


<div class="wrap">

    <div class="sidebar">

        Sidebar

    </div>

    <div class="container">

        <div class="box">

            Height1

        </div>

        <div class="box">

            Height2<br />

            Height2

        </div>

        <div class="box">

            Height3<br />

            Height3<br />

            Height3

        </div>

        <div class="box">

            Height1

        </div>

        <div class="box">

            Height2<br />

            Height2

        </div>

        <div class="box">

            Height3<br />

            Height3<br />

            Height3

        </div>

    </div>

    <div class="sidebar">

        Sidebar

    </div>

</div>