Question

如何确保我的内容始终位于页面的中心？我将最小和最大宽度和高度设置为固定的像素数，并将主体置于边距左侧：32％。但是当我改变浏览器大小时，身体会偏离中心。是否有另一个确保一切都在中心？

Answer 1

尝试使用以下内容：

margin:0 auto;

Answer 2

不要将margin-left设置为body标签上的百分比，它只是特定屏幕大小的中心。而是在你的css文件集中：

body{margin:0 auto;}

Here’s an example

Answer 3

在包装器上应用margin：0 auto是最常用的居中元素方式。要确保您的内容始终位于屏幕的中心，请将其包装在容器div中，指定宽度（对于RWD百分比，最有用）。保证金：0自动你几乎不会出错，但还有另一种方法也能很好地运作。

你可以使用position：relative;和css3翻译为您的内容的中心。如果您使用百分比进行定位和翻译，则永远不会出错。

基本代码：

<body>
  <div id="wrapper">
    The content
  </div>
</body>

CSS（用Sass编写）：

div#wrapper
  width: 75% // can be whatever you use
  position: relative
  left: 50%
  +translateX(-50%)

+ translateX（）是

的Compass mixin

 transform: translateX();

祝你好运！

Answer 4

请注意，您应仅在内容的实际容器上使用 margin：0 auto 。通常它用作：

body{
background: red;
}

.container{
background: green;
margin: 0 auto;
width: 960px;
overflow: auto;
}

为此，正文中的html看起来像

<body>
<div class="container">
    ****your content****
</div>
</body>