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

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

现在是问题。当playlist div不存在（未设置）时，如何使视频播放器容器位于页面中间，而不影响其余布局

明白了

---

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

您可以使用以下代码完成此操作：

.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;
}

---

你能上传这些元素的图片吗？你能添加你当前的HTML/CSS吗？还可以选择创建一个？那不拉伸视频播放器容器，而是保持其大小不变，并将其置于中间呢？@Karine:有点像。浏览器应首先设置右浮动div，以便左div可伸缩并适应右div。@Karine:您可以创建一个包装div，在左div内使用静态尺寸标注，并使用

边距：0 auto

将其居中。我将更新我的代码（哇！）请解释一下为什么将浮动的div class=“playlist”放在div class=“video”之前，因为在我的css代码中，我说了.playlist+.video，意思是播放列表之后的视频应用浮动：左&如果没有播放列表，则应用边距：0自动；在视频部门。这是一个伟大的解决方案，我也在寻找。但有些事情我不明白。“当播放列表div不存在（未设置）时，视频播放器容器将出现在页面中间”是什么意思。我不明白“（未设置）”是什么意思。如果删除.playlist类，则播放列表将消失，但这只是因为其中没有内容。如果该DIV中存在某些内容，它仍然可见。有没有一种方法可以让你的代码工作并且播放列表中仍然有内容——换句话说，播放列表中的内容不可见？