Question

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

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

我的身体宽度最大为500px，我使用margin:0 auto;来显示页面居中。但是这样，顶部固定的div不服从500px中间规则我希望它像整个身体内容一样固定在中心 enter image description here
我尝试使用*{margin:0 auto; max-width: 500px;}和其他一些更改，但没有得到我想要的。

Answer 1

在这种情况下，你不必给你的身体最大宽度试试这个：

<body>
  <div id="container">

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

的CSS：

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

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

Answer 2

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

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

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

.div {
    width: 100%;
    text-align:left;
    height: 32px;
}

指定固定和最大体宽时的Div对齐

2 个答案: