jquery - CSS:固定大小的div，固定的垂直位置和水平居中？

Question

在 CSS 中，是否可以有一个 <div>既水平居中又固定在浏览器底部？我正在为内部 div 使用设置的宽度和高度。

我试过用 position:relative 放置一个 div在固定的外部 div 内，垂直对齐，但外部 div 不居中，我回到正方形。

这甚至可以仅使用 CSS 来实现吗？我也在使用 jQuery，所以如果这是唯一的方法，我会使用它，但如果可能的话，我宁愿使用 CSS。

谢谢， 迪伦

Answer 1

想通了。

HTML

<div id="background">
    <div id="content">
    </div>
</div>

div#background{
    height: 800px;
    width: 100%;
    position: fixed;
    bottom: 0;
}

div#content{
    position: relative;
    margin: 0 auto;
    bottom:0;
    height: 700px;
    width: 800px;
}

将 div#background 宽度设置为 100% 仍然允许 div#content 使用 margin:auto，同时仍然动态调整到窗口宽度。