请问这个css问题出在哪里，为什么不满屏显示？

[zky0901]

.foot2 { margin:0 auto; text-align:center; height:20px; line-height:20px; padding:10px; background-color:#cccccc; width:100%;}
.foot { margin:0 auto; text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; width:100%;}

<div class="foot2"><a href="http://www.abc.com">首页</a></div>
<div class="foot">地址</div>

如上代码，上述代码为什么显示不能满屏呢，手机上不满屏，电脑上浏览器窗口不最大化时也不满屏显示，请问问题出在哪里？

[天际的海浪]

body {margin: 0; padding: 0;}
.foot2 { text-align:center; height:20px; line-height:20px; padding:10px 0px; background-color:#cccccc; width:100%;}
.foot { text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; width:100%;}

[zky0901]

引用 1 楼 jslang 的回复:

body {margin: 0; padding: 0;}
.foot2 { text-align:center; height:20px; line-height:20px; padding:10px 0px; background-color:#cccccc; width:100%;}
.foot { text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; width:100%;}

这样不行，你可以用手机访问www.yzfangcun.com看看底部

[天际的海浪]

引用 2 楼 zky0901 的回复:

[quote=引用 1 楼 jslang 的回复:]

body {margin: 0; padding: 0;}
.foot2 { text-align:center; height:20px; line-height:20px; padding:10px 0px; background-color:#cccccc; width:100%;}
.foot { text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; width:100%;}

这样不行，你可以用手机访问www.yzfangcun.com看看底部[/quote]
你这两个元素设置是width:100%;,而页面中其它版块width都固定是1100px，当手机屏幕宽度小于1100px时，，width:100%当然比1100px短了。
你可以强制规定手机屏幕宽度
<meta name="viewport" content="width=1100">

或者把这两个元素width:100%;改成 min-width:1100px;
.foot2 { text-align:center; height:20px; line-height:20px; padding:10px 0px; background-color:#cccccc; min-width:1100px;}
.foot { text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; min-width:1100px;}

[zky0901]

引用 3 楼 jslang 的回复:

[quote=引用 2 楼 zky0901 的回复:]
[quote=引用 1 楼 jslang 的回复:]

body {margin: 0; padding: 0;}
.foot2 { text-align:center; height:20px; line-height:20px; padding:10px 0px; background-color:#cccccc; width:100%;}
.foot { text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; width:100%;}

这样不行，你可以用手机访问www.yzfangcun.com看看底部[/quote]
你这两个元素设置是width:100%;,而页面中其它版块width都固定是1100px，当手机屏幕宽度小于1100px时，，width:100%当然比1100px短了。
你可以强制规定手机屏幕宽度
<meta name="viewport" content="width=1100">

或者把这两个元素width:100%;改成 min-width:1100px;
.foot2 { text-align:center; height:20px; line-height:20px; padding:10px 0px; background-color:#cccccc; min-width:1100px;}
.foot { text-align:center; background-color:#30333a; height:90px; padding-top:20px; line-height:22px; color:#FFFFFF; min-width:1100px;}

[/quote]

我用了上面的方法，可为什么显示不齐啊，底下还是不能全部到边满屏，为什么啊？

[Logerlink]

刚刚去看了你的网页发现底部黑色那块区域，跟上面灰色的那块区域少了个padding，按照下图的顺序加上去应该可以了