DIV元素不包含其所有内容

我的页面上有div问题。这是我拥有的唯一一个，它覆盖了我的页面中间。在CSS中进行了一些调整后，我完成了一切。DIV元素不包含其所有内容

的问题虽然是视频（这是div元素中），是偷跑出来，像这样：

enter image description here

这里的HTML：

<html> 
<head> 
<link rel="shortcut icon" href="Images/favicon.ico" /> 
<link rel="stylesheet" type="text/css" href="Style.css" media="screen" /> 
    <title>Arthur</title> 
    <meta content="text/html" charset="windows-1251"> 
    </head> 
<Body background="Images/background2.jpg"> 
<A Href="main.html"><IMG class="imgborder" src="Images/button.png" align="left"  height="50"></A> 
<div id="wrapper" style="background-color:black; width:60%; margin-left: auto ; margin-right: auto ;"> 

<center><img width="60%" src="Images/logo2.png"></center> 
<BR><BR> 
<center><img class="imgborder" height="300" src="Images/muller.jpg"></center> 
<Font size="5" color="crimson" face="Calibri"> 

<Center><P align="justify">... </P> 

<P align="justify">...</P> 

<P align="justify">...</P></Font></Center> 



<Center><iframe width="640" height="360" src="..." frameborder="5" 
allowfullscreen></iframe></Center> 
<Font size="5" color="crimson" face="Calibri"><P>Thomas Muller</P></font> 



</div> 
</body> 
</html>

而这里的CSS：

@charset"utf-8"; 
/* CSS Document*/ 
/*This section is for links*/ 
a:link { 
    font-weight:normal; 
    color:crimson 
} 
a:visited { 
    font-weight:normal; 
    color:Crimson; 
} 
a:hover { 
    font-weight:bold; 
    color: Royalblue; 
    font-variant:small-caps; 
} 
/*This section is for a paragraph section*/ 
p { 
    font-style:normal; 
    font-size:18px; 
} 
blue { 
    color:crimson; 
} 
/*This section is for the image's black border.*/ 
.imgborder { 
    border-color: crimson; 
    border:thick; 
    border-style:outset; 
} 
.body { 
    background-color: #0000FF; 
} 
html, body { 
    height:100%; 
} 
#wrapper { 
    margin: 0 auto; 
    width: 990px; 
    height:100%; 
    overflow:hidden; 
    position:relative; 
} 
#navigation { 
    margin: 0 auto; 
    width: 990px; 
    height: 55px; 
    background-color: #fff; 
} 
#bottom Half { 
    margin: 0 auto; 
    width: 990px; 
    height: 100%; 
    background-color: #4d3c37; 
} 
div { 
    /* set div to full width and height */ 
    width: 100%; 
    height: 100%; 
} 
p { 
    margin-left:2cm; 
    margin-right:2cm; 
}

来源

2013-05-04 user2350028

我认为您的主要问题实际上是您将已弃用的HTML与您发明的标签混合在一起，并且没有正确嵌套它们。 – 2013-05-04 17:32:41

这个HTML！最后一次出现在1998年 – Ejaz 2013-05-04 17:54:18

我能想到的唯一解决方案是手动LY调整黑框的高度，或者添加

overflow: hidden;

属性框（在相当困难的理解的标签系统，我相信这将是<Center>）。

现在，元素是从其父容器（黑盒）溢出。通过为此框指定高度，您可以控制大小。

通过指定overflow: hidden，您可以隐藏框的溢出 - 这样做的两件事情之一：

隐藏任何泄漏开箱，防止那些比框的大小，显示部分大要素那会显得“绑定”由容器的边缘
如果元素与语义HTML，不由height约束和width会自动来调整自身以适应其内容的诸多元素选择适当

另一种可能的解决方案是为容器及其子代指定position: relative和/或float: none，这有时可以解决问题。

要再次强调，这是我们很难测试和调试你给我们，因为它实际上是过时的代码。

来源

2013-05-04 17:57:44

你能详细说明为什么它很难理解（HTML新手，可以使用一些建议）。 – user2350028 2013-05-04 18:17:56

您的HTML并不符合现代标准（请参阅http://www.w3.org/html/和http://www.w3.org/TR/html5/），因此很难处理。 – 2013-05-04 20:22:52

将继承用于视频的样式。像显示样式属性可以是'继承'，以及高度和宽度。

来源

2013-05-04 18:03:06 V31

我如何使用继承？ – user2350028 2013-05-04 18:19:36

style ='display：inherit;'宽度=“继承” – V31 2013-05-04 18:23:32

DIV元素不包含其所有内容

回答

相关问题