背景宽度+页脚的拉伸幅度超出了应有的幅度

问题描述

|| 我有这个网站：http://www.ryansammut.com/orijen/contact.html。 页脚比Firefox中的页脚还宽松，但是在IE和Chrome中都可以。 当我放大很多并向右滚动时，背景也会消失。     

解决方法

该网站存在一些繁重的设计问题... 但是，如果我不理会它们，而只是以最简单，最肮脏的方式解决当前的问题，我建议将此CSS添加到底部：

body {
    margin: 0 auto;
    width: 1280px;
}

由于我无法将所有时间都花在做您的工作上，所以我能做的就是为未来提供建议：) 减少您的整体宽度 网站大约是984px 容纳更多屏幕尺寸。 重新设计集装箱箱的布局， 把它们画在纸上 至。 了解有关适应成长的信息， CSS中的缩小到适合宽度以及如何 触发他们 使用相对定位并避免 如果您使用左/右 没有经验。 安装firebug并尝试 CSS使用它。 编辑： 依次设置3格，每个格分别用width：auto（默认）。 称他们为＃header，＃content，＃footer 给每个div一个sub div，一个.sub类，并为其赋予与父级相同的背景。 使.sub类具有所需的宽度（1280px），并将其保持等于3。 给.sub class

margin:0 auto;

因此您的网站结构如下所示：

<div id=\"header\">
    <div class=\"sub\"></div>
</div>
<div id=\"content\">
    <div class=\"sub\"></div>
</div>
<div id=\"footer\">
    <div class=\"sub\"></div>
</div>

和你的CSS是这样的：

#header,#content,#footer {
    width:auto;/*not necessary as it\'s the default value anyway*/
    position:relative;/*not necessary but will help later on*/
}
#header .sub,#content .sub,#footer .sub {
    width:1280px;
    margin:0 auto;
}
#header,#header .sub {
    background:whatever1;
}
#content,#content .sub {
    background:whatever2;
}
#footer,#footer .sub {
    background:whatever3;
}

这是你想要的吗？ 另外，如果您不想更改网站的html，则可以尝试使用最小宽度。 在IE6中，宽度几乎与最小宽度相同。