有没有比 text-align: center 更好的方法来水平对齐元素？答案

【问题标题】：Is there a better way to horizontally align elements, than text-align: centre?有没有比 text-align: center 更好的方法来水平对齐元素？
【发布时间】：2014-09-03 02:47:35
【问题描述】：

我有一个 div，我需要将里面的所有元素都居中，这包括；文字和一些图片。

.class {
    text-align: centre;
}

有效，但是是否有更好的（最佳实践）方法来做到这一点？我尝试摆弄边距等...直到我调整到浏览器窗口的大小，它才起作用，任何向下移动（下一行）的图像都会自动向左对齐？

我要问的是有没有类似于vertical-align 但用于水平对齐元素的css 类？

【问题讨论】：

有很多方法，但没有比这更好的了。此外，大多数技术在某些时候都需要text-align:center。这正是这个属性的目的。不过，我不明白您为什么要寻找其他东西，所以不确定我是否收到您的问题
我正在寻找一种属性，用于将图像等元素对齐到中心，而不仅仅是文本。
至少展示一个示例（带有 valid HTML 和 CSS），说明您尝试过的操作，并说明您预期会发生什么以及失败的原因。

标签： html css position alignment

【解决方案1】：

text-align: center (not center) 是您最好的选择。您可以采取一些措施来防止项目换行，例如根据媒体查询在此 div 内的图像上设置（最大）宽度。但只要将它们对齐在中心，只需使用text-align，如果你想换行，一个简单的br 就可以了。

你说你玩的是利润。如果您想在同一行中分隔元素，请继续使用 margin 属性，但除了父 div 上的 text-align。

【讨论】：

【解决方案2】：

您可以使用边距水平对齐

margin: 0 auto;

http://jsfiddle.net/knzg410f/

【讨论】：

【解决方案3】：

另一种方式：要水平对齐，您可以使用段落标签：

<p align="center">your text here</p>

http://jsfiddle.net/3Lz59zca/

【讨论】：