Question

我有一个div中心对齐：

<div id="container" style="position:absolute; top:0px; left:50%; margin-left:-500px; width:1000px;"></div>

正如此解决方案Trying to center div horizontally and vertically in screen所示。

问题是如果客户端窗口的宽度（在FF 15.0.1中尝试）小于1000px，水平滚动条将不允许显示div的左侧。

有没有纯粹的html / css解决方法？

Answer 1

嗯。您无法调整客户端窗口的大小您可以做的一件事是避免左滚动将父div的宽度设置为1000px

  <div id="parent" style="min-width:1000px;"> 
      <div id="container" style="position:absolute; top:0px; left:50%;
        margin-left:-500px; width:1000px;"></div>
  </div>

注意：
您可能必须将html和body标记的宽度设置为min-width=100%

<强>更新

 <html style="min-width: 100%; background-color:Gray;">
 <body style="min-width: 100%; background-color:White;">
 <div id="parent" style="min-width: 1000px; position:relative;">
    <div id="container" style="position: absolute; top: 0px; left: 50%; margin-left: -500px;
        width: 1000px; border: 1px solid red; height: 10px;">
        1 2 3 4 5
    </div>
  </div>
 </body>
 </html>

我想念position:relative来描述。这段代码正在运行。

固定中心对齐与小窗口的左边距左侧技巧

1 个答案: