html - 在 div 内居中 div 并对齐它的 block

Question

好吧，正如我在下面链接的屏幕截图中所示，将包含两个 Tumblr 帖子列的 div 居中时会出现问题。我想让它居中在页面的一部分，没有给出侧边栏。此外，我想在没有任何空间的情况下在两个栏中发布帖子。图片:http://i.stack.imgur.com/VLkkr.jpg

CSS:

        body {
            margin: 0px;
            background-color: antiquewhite;
            text-align: center;
            word-wrap: break-word; 
        }
        body #content {
            width: 900px;
            display: inline-block;
            margin: 15px 15px 15px 15px;
        }
        body #content #wrapper {
            display: inline-block;
            max-width: 900px;
            margin-left: auto;
            margin-right: auto;
        }
        body #content #wrapper #posts {
            display: inline-block;
            background-color: white;
            width: 400px;
            margin: 0 15px 15px 0px;
            padding: 10px;
            float: left;
            text-align: left;
        }
        body .sidebar {
            display: table;
            width: 250px;
            height: 100%;
            position: fixed;
            top: 0px;
            right: 0px;
        }
        body .sidebar .sidebar-inside {
            display: table-cell;
            max-width: 250px;
            margin: 0 auto;
            vertical-align: middle;
        }
        /* etc */

HTML:

<!-- These two columns -->    
    <div id='content'>
    <div id='wrapper'>
    {block:Posts}
    <div id='posts'>
        {block:Photo}
            <!-- Here are posts. -->
    </div>
        {/block:Posts}
    </div>
    </div>
    
<!-- Sidebar -->
    <div class='sidebar'>
        <div class='sidebar-inside'>
        </div>
    </div>

帮帮我，伙计们!请!

Answer 1

也许(一方面)使用 CSS3 Column 的解决方案:(并且不要多次使用 id 属性.. 使用类..)

body #content #wrapper {
    -moz-column-count:2;
    -webkit-column-count:2;
    column-count:2;
    -moz-column-gap:405px;
    -webkit-column-gap:405px;
    column-gap:405px;
}

body #content #wrapper #posts {
    <strike>float: left;</strike> /*delete this one..*/
    -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
}

编辑:用户要求更多..

原因是侧边栏是position:absolute;所以它不计入可用于居中的空间..

place this just behind </div> from wrapper
<div class="Gh2"></div>

.Gh2 {
    width: 250px; /*sidebar width*/
    float: right; /*place it to the right where sidebar is*/
    height: 1px; /*need some height..*/
}

比:

body #content {
    /* width: 900px;  deleted those unwanted settings*/
    /* display: inline-block; deleted those unwanted settings*/
    margin: 15px 15px 15px 15px;
}