CSS中的对齐/边距答案

【问题标题】：Align/Margins in CSSCSS中的对齐/边距
【发布时间】：2011-06-05 23:40:18
【问题描述】：

为什么下面看起来什么都没做？

    <style>
    form {
        margin-left:auto;
        margin-right:auto;
    }
    h1 {
        margin-left:auto;
        margin-right:auto;
        color : #2265FF;
    }
    </style>
<body>
<h1>Please type in the text to be converted!</h1>
<form> ... </form>

显然，我有更多的 HTML 来配合这个。

在 CSS3 中有没有更好的方法来做到这一点？

谢谢！

【问题讨论】：

你想做什么？更多信息请。
你到底想做什么？请详细说明一下？
显示应用此功能的 HTML 可能是个好主意。

标签： html css margin alignment

【解决方案1】：

您最好使用text-align:center，因为<form> 和<h1> 默认将其宽度设置为100%。

【讨论】：

【解决方案2】：

在 CSS3 中你可以这样做：

form, h1 {
    display: table;
    margin: 0 auto;
}

如果要支持旧版浏览器，需要指定宽度：

form, h1 {
    width: 500px
    margin: 0 auto;
}

但是如果你将它应用到父容器上实际上会更好......

.container {
    margin: 0 auto;
    width: 500px;
}

<div class="container">
  <h1></h1>     
  <form></form>
</div>

【讨论】：