修复了调整浏览器大小时页脚错位的问题

Question

我有一个固定的970像素宽的页脚，但当我将浏览器调整得更小时，整个页脚会离开屏幕，页脚的中心在中间。当调整浏览器大小小于970像素宽度时，我希望我的页脚停止离开屏幕。

CSS

footer{
    z-index: 1;
    position: fixed;
    width: 940px;
    line-height: 30px;
    background: linear-gradient(#232323, #1f1f1f);
    margin: 0 auto 0 -485px;
    padding: 0 30px;
    bottom: 0;
    left: 50%;
    text-align: center;
}

HTML

<footer>Footer Text</footer>

有人知道我是怎么做到的吗？

Answer 1

您的左边距为负-485px，左边距为50%。我只想用

footer {
    margin: 0 auto;
}

并完全移除左侧位置。

Answer 2

没有任何HTML很难说，但根据我的猜测，你有两个选项：

1. 如果浏览器<940px，如果是这样，为什么不将其设置为具有width:100%和max-width:940px;。您可能还需要overflow:hidden;、

2. 你的页脚没有正确居中，在这种情况下，用width:100%（或计算为与你的页面一样宽）和text-align:center;将其包裹在div中，并给页脚（放置在div中）margin:0 auto;

像这样的小提琴