Css 未展开元素的Div

我已经为我的制作公司建立了一个新网站，现在这个网站相当挑剔

我有一个主体元素，它包含一个视频和一个边栏div。它们被设置为向左和向右浮动，它们和一个标题div都包含在一个大的“frame”div中，该div位于页面的中心。大纲是这样的：

<frame>
    <header>
    </header>
    <main>
        <video>
            <vidframe> <- This is for keeping the iframe's aspect ratio (read it in some online tutorial)
                <iframe>
                </iframe>
            </vidframe>
        </video>
        <sidebar>
        </sidebar>
    </main>
</frame>

再说一遍，这都是现场直播

---

谢谢你的帮助

您需要清除浮动。在带有类main的div的结束标记之前添加

。在html的第34行之后

谢谢。为什么这能解决问题？浮动div不算作div内容的一部分吗？@Patrick浮动就是这个意思——它将元素从布局和线条计算中去掉。清除浮动可以将清除之前的所有浮动内容封装在布局模型中的一个虚拟框中。

div.frame {
    width:70%;
    height:auto;
    background-color:#FFF;
    margin-left:auto;
    margin-right:auto;
    padding:0;
    box-shadow:0 0 20px 0 #000;
}
div.main {
}
div.video {
    margin-left:3.57%;
    margin-top:3.57%;
    width:57.14%;
    float:left;
}
div.vidframe {
    position:relative;
    padding-bottom:56.25%;
    height:0;
    overflow:hidden;
}
div.vidframe iframe {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
div.sidebar {
    margin-right:3.57%;
    margin-top:3.57%;
    width:32.14%;
    float:right;
}