两列 DIV 布局变为一列中心对齐

Question

在我的网页中心，我有一个 id 为 center-container 的 div，其中包含 2 个 div：一个用于视频播放器（左侧），第二个（右侧）用于播放列表等可选内容。在中心容器 div 的上方和下方，我还有另一个内容。

现在是问题。当播放列表 div 不存在（未设置）时，如何使我的视频播放器容器到达页面中间而不影响剩余布局。

Answer 1

知道了！

http://jsfiddle.net/6y5N4/7/

一直在用这个！只需从容器中删除应该是可选的内容（如播放列表），另一个容器应该可以毫无问题地伸展。

Answer 2

您可以使用更少且简单的代码来做到这一点：

.playlist{
    width:100px;
    height:100px;
    float:right;
    background:blue;
    margin-right:20px;
}
.playlist + .video{
    width:200px;
    height:100px;
    margin-left:20px;
    background:green;
    float:left;
}
.video{
    width:200px;
    height:100px;
    margin:0 auto;
    background:green;
}

http://jsfiddle.net/qcTSt/