<body> <div ID="wrap"> <div ID="header"> header </div> <div ID="inner-wrap"> <div ID="content"> CONTENT </div> </div> <div ID="footer"> FottER </div> </div> </body>
和CSS:
HTML { height:100%; max-height:100%; }body { margin:0; padding:0; height:100%; max-height: 100%;}#wrap { min-height:100%; height: 100%; position:relative;}* HTML #wrap { height:100% }#inner-wrap { padding-bottom:50px; min-height: 100%;}#inner-wrap:after { content:" "; display:block; clear:both;}* HTML #inner-wrap { height:100%;}#header{ wIDth: 100%; background-color: #C0C0C0; height: 16px; color: White; text-align: center; position: relative; top:0px;}#footer{ wIDth: 100%; background-color: #C0C0C0; height: 50px; position:absolute; bottom: 0; color: White; text-align: center;}#content{ wIDth: 1000px; height: 100%; background-color: #F5FDEC; margin: 0 auto 0 auto;}
问题:
我怎么能做到这一点:header top 16px,
内容动态100%高度,
FOOTER在页面末尾
如果我100%给内包装div,它们在页脚之后是白色空间.
谢谢
解决方法 你有太多的高度:从选择器中删除最小高度和最大高度值.
删除位置:绝对;来自你的#wrap div.
我做了一个例子for you here.
总结以上是内存溢出为你收集整理的html – CSS – 标题 – 始终是底部页脚和100%内容全部内容,希望文章能够帮你解决html – CSS – 标题 – 始终是底部页脚和100%内容所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)