将 html 元素置于其包含元素中的最佳方法是什么？答案

【问题标题】：What is the best way to center an html element within its containing element?将 html 元素置于其包含元素中的最佳方法是什么？
【发布时间】：2010-09-28 13:42:56
【问题描述】：

假设您有以下代码块：

<div id="container">
  <someelement>This is any element.</someelement>
</div>

什么是我可以用来在其包含的 div 中水平居中“someelement”的最佳 CSS？

【问题讨论】：

标签： html css center

【解决方案1】：

JaredPar 的想法是正确的，但这里有一种更简洁的方式来做您正在寻找的事情；)

#container {
    text-align: center;
}

#container someelement {
    margin: 0 auto;
    text-align: left;
}

【讨论】：

为什么 0 自动与自动？不是 CSS 爱好者，所以答案显而易见
Jared: 0 auto 比单独执行 margin-left/margin-right 更干净。在功能上它们是相同的（至少，我 99% 确定它们是相同的）。
0 表示上下边距，auto 表示左右边距

【解决方案2】：

如果您的 <someelement> 是内联元素（即默认显示：内联），则将 text-align: center 应用于其容器。如果<someelement> 是一个块元素，将左右边距设置为自动并记住设置宽度（块元素默认占用所有可用的水平空间，除非明确说明宽度）。如果您希望它也能在 IE 5.5 及更低版本中工作，您可能必须同时使用这两种方法。

【讨论】：

【解决方案3】：

试试

<someelement style="margin-left:auto;margin-right:auto">This is any element</someelement>

【讨论】：