内容忽略标头

时间:2014-05-16 01:23:20

标签: html css

我无法理解为什么我的内容和侧边栏元素忽略了标头并出现在它上面。我没有宣称桅顶的位置是绝对的,所以他们不应该忽略桅顶元素。

http://jsfiddle.net/Ljzbd/

CSS

/* Body Declarations for the all elements */
body {
font: normal 62.5 "Lucida Grande", Verdana, sans-serif;
padding:0;
margin:0 auto 0 auto;
    width:760px;
}



/* masthead and descendants */
#masthead {
height:200px;
    background-color:red;
}

/* sidebar and descendants */
#sidebar {
  float:left;
  width:300px;
  background-color:blue;
}

/* content and descendants */
#content {
  float:right;
width:450px;
background-color:yellow;
margin-bottom:10px;
}

/* footer and descendants */
#footer {
    clear:both;
background-color:green;
}

2 个答案:

答案 0 :(得分:2)

我假设你的"标头"是红色的div。内容出现在红色元素之上的原因是因为您未正确结束div(第14行打开另一个div)。这会解决您的问题吗?

<div id="masthead">
</div>

http://jsfiddle.net/ZLk7b/

答案 1 :(得分:0)

在您的示例中,您没有关闭标头元素。