以页面问题为中心

Question

好的，让我看看能不能解释一下。我的页面内容宽度为960px。它以另一个宽度为1426px（#siteWrap）的div为中心。

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

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

任何帮助都将不胜感激。

Answer 1

只需设置

宽度：100％;

和保证金：0自动;应该在你的内容div上设置，而不是在这个上。

Answer 2

当容器水平溢出时，浏览器的自然反应是将其停靠在屏幕的左侧。我认为应该这样做。要解决此问题，您可以use Javascript to center your container element根据屏幕/视口分辨率计算必要的偏移量。

Answer 3

尝试以下方法：

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

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