Question

我无法弄清楚身体包裹元素无法正常工作的原因。

我不想添加额外的div并将其保存在该公式中。

有什么想法吗？

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>

body {
    background: #fff;
    border: 1px solid #ccc;
    margin: 10px auto;
    padding: 10px;
    width: 400px;
    position: relative;
}

aside {
    float: right;
    width: 344px;
}


aside section:first-child {
    border-color: #cc0000;
    border-style: dotted;
    border-width: 2px;
    text-align: center;
}

aside section:first-child video {
    width: 320px;
    height: 240px;
}

</style>
</head>
<body>

    <aside>

        <section>

            <video width=320 height=240 controls preload=none poster="https://puaction.com/vid/mainvideo/pua-video.jpg">
                <source src="https://puaction.com/vid/mainvideo/mainvideo.mp4" type="video/mp4">
                <source src="https://puaction.com/vid/mainvideo/mainvideo.webm" type="video/webm">
                <source src="https://puaction.com/vid/mainvideo/mainvideo.ogv" type="video/ogg">
            </video>

        </section>

    </aside>

</body>
</html>

jsFiddle：）

这里有什么问题？

http://jsfiddle.net/R3kBx/

Answer 1

将class="clearfix"添加到您的身体。然后在你的CSS中添加：

.clearfix:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

HTML5旁边的元素没有包装在包装器中

1 个答案: