大佬教程收集整理的这篇文章主要介绍了css – Html div宽度100％不起作用，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
第一个标签是id =“header”的div.我给它100％宽度并给它一个背景图像.
在标题内部还有另一个id =“header-contents”的div.我希望它集中在页面上,所以我给它一个宽度然后保证金：0自动.它适用于最大尺寸的浏览器,但是当我放大或缩小浏览器宽度大约一半时,标题div的背景在某个点开始消失并且不会填充100％的宽度.
这是它首先看起来的样子(并且应该总是看起来)：
intended look http://i49.tinypic.com/3505fnk.png
这是我缩放或调整浏览器大小时的外观：
after resize http://i46.tinypic.com/2lqg7r.png
什么是适当的HTML和CSS？
这是代码：
<!DOCTYPE HTML> <html> <style> body { margin:0; padding:0; } .clear { display:block; clear:both; } #header { min-height:156px; width:100%; BACkground-image:url('http://www.webdesignideas.org/images/bellevueBg.gif'); } #head-contents { width:974px; margin:0 auto; height:156px; } #header ul { margin:85px 23px 0 0; float:right; list-style-type:none; } #header ul li { display:inline; } #header ul li a { margin-left:46px; font-size:19px; color:#fff; text-decoration:none; } #header ul li a:hover,#header ul li a.active { color:#FD7600 } </style> <body> <div id="header"> <div id="head-contents"> <img src="http://t1.gstatic.com/images?q=tbn:ANd9GcRRlklPBeTiVsV7dycvDxqFyrU02d0grYf4rTUqL-2ZzGb8Qvbwimb37HgO" /> <ul> <li><a href="#" class="active">Home</a></li> <li><a href="#">Products</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> <div class="clear"></div> </div> </div> </body> </html>@H_944_17@
#header { height: 156px; min-width: 990px; BACkground-image: url('http://www.webdesignideas.org/images/bellevueBg.gif'); display: block; } #head-contents { width: 974px; margin: 0 auto; height: 156px; }
这都是#header中最小宽度的问题.我检查了facebook的登录页面并弄明白了.
@H_944_17@ @H_944_17@以上是大佬教程为你收集整理的css – Html div宽度100％不起作用全部内容，希望文章能够帮你解决css – Html div宽度100％不起作用所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。