html - 居中页面问题

Question

好的，让我们看看我能不能解释一下。我的页面内容的宽度为 960 像素。它位于另一个宽度为 1426 像素 (#siteWrap) 的 div 中。

#siteWrap{
margin:0px auto;
width:1426px;
background: url(../images/bg.jpg) no-repeat ;
}

我需要了解的是如何让#siteWrap 以页面为中心，而不管屏幕分辨率如何。我的大多数访问者都使用 1024x768 的屏幕分辨率。当我在该分辨率上测试此页面时，我被迫从左到右滚动以访问站点内容。

任何帮助，将不胜感激。

score 2 · Accepted Answer

刚设置

宽度：100%；

和边距：0自动；应该在您的内容 div 上设置，而不是在这个上。

score 0 · Accepted Answer

当容器水平溢出时，浏览器的自然反应是将其停靠在屏幕左侧。我认为它应该这样做。为了解决这个问题，您可以使用 Javascript通过根据屏幕/视口分辨率计算必要的偏移量来使容器元素居中。

score 0 · Accepted Answer

尝试以下操作：

#sitewrap {
   position:absolute;
   top:0px;
   left:50%;
   width:1426px;
   margin-left:-713px;
   background: url(../images/bg.jpg) no-repeat ;
}

这将居中，但会溢出浏览器窗口。

3 回答 3