html - 全宽画廊，中间有一张图片

Question

我必须创建一个“无限”宽度的图库，每张幻灯片都是 940px 宽，网站中心很简单 width:940px;margin: 0 auto 0;我怎样才能强制当前图像正好位于网站的中心？

这是我的尝试:

1

  #gallery {
    white-space: nowrap;
    text-align: center;
  }

2

  #gallery {
    width: 100%;
    text-align: left;
  }

请注意，我可以用 javascript 解决这个布局问题，我正在寻找一个解决方案 纯 CSS。

谢谢。

Answer 1

这可能会有所帮助 - 以下 CSS 会将一个 div 放置在中心/中间(水平和垂直)，而不是像 align:center 那样只是水平居中。

http://jsfiddle.net/fSNJR/

#centerdiv { 
position:absolute; 
top:50%; 
left:50%; 
width:940px; 
height:300px; 
margin-top:-150px; /* Half your height */
margin-left:-470px; /* Half your width */
background:#333; }