1

这是我目前正在开发的网站：

http://whybaguio.com/php/about/about.php

页脚正在创建一个额外的水平滚动条。我不太确定出了什么问题，但有人可以帮助我吗？它还在左侧创建了一个额外的空白......

谢谢！

4

5 回答 5

1

页脚左侧的空白是 body 标签上的默认边距/填充。此外，您的页脚的宽度为 100% + 填充，这意味着超过 100%。如果您删除 100% 语句，浏览器会将其设为 100% bij 默认并补偿填充。

将以下两个更改应用于您的 CSS，一切都会好起来的：

body {
  padding: 0; // add this line
  margin: 0; // add this line
}

#footer {
 width: 100%; // remove this line
}
于 2013-03-26T10:30:44.703 回答
1

这是因为您已经指定了 100%width 和 padding一个block元素。如果您对旧 IE 版本不太在意，您可以通过简单地添加以下内容来解决此问题：

#footer {
    width:100%;
    padding:30px;
    ...
    -webkit-box-sizing:border-box; /* Older webkit */
    -moz-box-sizing:border-box; /* Firefox */
    box-sizing:border-box;
}

您可能还希望将页面的bodyamargin设为 0，以使页脚完全到达屏幕的左侧、右侧和底部。

于 2013-03-26T10:29:23.760 回答
0

在您的页脚上设置padding-left: 0;和。我也想知道......为什么丑陋的自定义滚动条？padding-right:0;div

于 2013-03-26T10:30:45.683 回答
0

这是因为您在#footer 上使用了 100% 并且还应用了左右 30px 的填充，这将增加 100% 的屏幕宽度。

从#footer 中删除以下 CSS：

padding: 30px;
于 2013-03-26T10:29:43.337 回答
0

尝试：

#footer{

...
padding: 30px 0;
...

}
于 2013-03-26T10:33:23.540 回答