页脚跨越页面的宽度和居中的图像，具有先前设置的边距

Question

我有一个位于 CMS 下的页面，该 CMS 设置页边距。但是，在这个页面上，我需要一个页脚来跨越页面的宽度，忽略那些边距。此页脚包含必须水平居中的图像。如果我知道页面宽度，我可以对样式执行以下操作：

.bgd {
    position: absolute;
    left: 0;
    width: 1378px;
}
.fgd {
    text-align: center;
}

还有这样的身体：

<div class="bgd">
   <div class="fgd">
       <img src="fgd.png" />
   </div>
</div>

只要页面宽度为 1378 像素（没有滚动条），此功能就可以使用。但是，我需要一个无论页面宽度如何都可以工作的解决方案。我可以尝试 javascript，但必须有一个纯 CSS 解决方案。

如何更改上述内容，使其跨越整个页面的宽度并将图像居中而不考虑之前的边距、页面宽度、滚动、调整大小等？

Answer 1

您可以添加right: 0 使元素跨越整个宽度，这样做时，您无需设置硬编码宽度。

.bgd {
    position: absolute;
    left: 0;
    right: 0;
}
.fgd {
    text-align: center;
}