0 
body {
   margin:0 auto;  
   max-width: 500px;
}

.div{ 
   text-align:left;
   position: fixed; 
   top 0; 
   width: 100%; 
   z-index: 1; 
   display: block; 
   height: 32px;
}

我的正文宽度最大为 500 像素，我margin:0 auto;用来显示页面居中。但是这样一来，顶部固定的 div 就不遵守 500px 中间规则了。
我希望它像全身内容一样固定在中心。
在此处输入图像描述
我尝试使用*{margin:0 auto; max-width: 500px;}和其他一些更改，但没有得到我想要的。

4

2 回答 2

0

在这种情况下，您不必为您的身体提供最大宽度，请尝试以下操作：

<body>
  <div id="container">

    <!--place your div-->
  </div>
</body>

CSS：

#container {margin:0 auto; max-width: 500px;}

当您将 div 放入容器中时，它们会遵循最大宽度规则

于 2013-10-28T08:08:29.603 回答
0

您的规则不相互依赖。他们实际上并没有改变任何东西。
max-width是元素可以拥有的最大宽度。这并不意味着它会拥有它。
width: 100%意味着元素 ( div) 将占据其父元素的100%body的宽度 - 即.
因此，在您的示例中，主体的默认宽度可能是窗口的100%div.div ，并将继承该宽度。
我建议设置这个

body {
    margin: 0 auto;
    width: 500px;
    overflow: visible;
}

您还必须position: fixed从 div 中删除。div 的 CSS 应如下所示：

.div {
    width: 100%;
    text-align:left;
    height: 32px;
}
于 2013-10-28T08:22:44.610 回答