定位固定内容重叠问题 [英] Position fixed content overlapping problem
问题描述
这是我的html5标记
This is my html5 markup
<div id="header">
</div>
<div id="content">
</div>
<div id="footer">
</div>
现用css
header{ height: 95px;position: fixed;width: 100%;min-width: 980px;}
footer{background:#000000;bottom:0;height:30px;position:fixed;width:100%;min-width: 980px}
现在我的问题是当我放任何内容里面
Now my problem is when i put any content inside
<div id="content">
</div>
内容来自top：0，这不是必需的。我不想在内容上使用填充或边距。是否有任何方式来自哪个内容来自标题。
The content comes from top:0 which is not required. I dont want to use padding or margin top over content. Is there any way from which content comes below header.
推荐答案
主要原因是因为< header> 是 position：fixed 将其从文档流中取出。您需要将 margin 或 padding 添加到< body> 或您的< content> （??）元素。此外，如果使用HTML5元素，请将其添加到CSS规则的顶部以与旧版浏览器兼容。
The main reason is because the <header> is position:fixed taking it out of the document flow. You'll need to add margin or padding to either the <body> or your <content>(??) element. Also, if using HTML5 elements, add this to the top of your CSS rules for compatibility with older browsers.
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
取自 Eric Meyer的CSS重置。
这篇关于定位固定内容重叠问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
