Html Firefox背景图像水平居中异常

我正在为CMS构建一些基本的HTML代码。 CMS中与页面相关的选项之一是“背景图像”和“将页面宽度/高度拉伸到背景图像宽度/高度”。这样，对于大背景图像，整个内容都变得可见

我当前的屏幕分辨率是1280 x 1024

如果我这样做：

• 指定宽度为1400px的背景图像
• 将“位置”指定为“中心”（水平/垂直）
• 指定“将页面宽度拉伸到背景图像宽度”

然后在FF中，发生以下情况：

• 页面已正确拉伸至1400px。我得到了一个水平滚动条，因为我的屏幕比它小。到目前为止还不错
• 现在奇怪的事情是：背景图像不是以1400px为中心，因此显示了完整的图像，而是以1280px为中心，将图像的一部分隐藏在屏幕左边缘之外，并在右侧留下一条白色条纹，而不是显示整个图像
• 没有其他元素（div、wrappers…）可以操纵任何东西。所有设置都直接在主体中

更新：IE做得正确。谷歌浏览器也有同样的问题

就好像Firefox首先以100%的宽度渲染背景图像，使其居中，然后注意到身体需要拉伸到1400px

这是Firefox的正常行为吗？ 你知道我能做什么吗

发布一个链接会有点麻烦，因为它都是在一个封闭的开发环境中进行的，但是如果所有其他的都失败了，我会把一些东西放在一起看

CSS：

body 
 {
 background-image: url(http://www.domain.com....image.jpg);
 background-repeat: no-repeat;
 background-position: center center;
 min-width: 1400px;
 height: 100%;
 }

---

背景位置应为左上方； 你准备好了吗

body{
margin:0;
padding:0;
}

尝试添加：

width: 100%;
display: table;

---

对于

主体

标记样式（另外，

背景附件：已修复；

可能是必需的）

您正被CSS规范的一个怪癖所困扰：多亏了，应用于

主体

元素的任何背景图像都会变成

html

的背景。（这是为了让作者可以继续使用body标签上的背景，而他们希望它来自CSS之前的浏览器。）

在IE中，

html

表示整个文档画布，并展开以适应扩大的正文宽度。在其他浏览器中，它与任何其他

display:block

元素类似，并保持视口宽度，而不管您在其中放置了什么。其他浏览器在这里可能更正确，但CSS规范在这个主题上并不十分清楚，结果是IE中的结果更接近于14.2中关于画布的措辞。无论哪种方式，它都不是真正指定的可靠行为

通过在

html

而不是

body

上设置宽度和背景，可以在不同浏览器中获得一致的结果。（记住在IE中使用标准模式。）

---

但是

1400px

固定宽度的文档？听起来真是个糟糕的主意。

应该是“最小宽度：1400px”，我改了，但问题仍然存在。背景位置必须能够居中，因为屏幕的宽度可以超过1400px，然后需要定位图像。

display:table

？嗯？除非您使body

的所有子元素显示：表行

，以及它们的子元素显示：表单元格，否则将产生完全未定义的结果。显示：表听起来确实很危险。我同意上面的答案。不管怎样，谢谢。事实上，我在firefox和大背景图片（居中）方面遇到了问题-如果你将窗口的大小调整为更小，那么内容背景就会向左移动。添加

显示：表格；宽度：100%关于
正文
解决了我的问题…感谢您提供的精彩信息。正如我后来更正的，1400px应该是最小宽度。将尝试html路由。