将元素水平居中且边距的先决条件:0 auto;

Question

对于

要与margin:0 auto;水平居中的元素，最低样式声明要求是什么？

以及包含 elment 的最低要求样式声明？

我希望解决方案与元素类型无关，即无论它是span、div、a等都可以工作。

该解决方案应该适用于任何现代浏览器。

Answer 1

下面是

一个具有最少所需属性的泛型类（避免使用margin: 0 auto简写，以免不必要地覆盖margin-top和margin-bottom属性）：

.horizontal-center {
    margin-right: auto;
    margin-left: auto;
    display: block;
    width: 80%; /* any value other than auto */
}

对.horizontal-center父级的唯一约束是它需要display: block|inline-block和大于或等于.horizontal-center的width。

Answer 2

您

还必须指定width，因为如果块级元素上没有width，则它只会占用所有 100% 的水平空间。

对于像这样的标签 span 或 a ，您必须使它们display block .

Answer 3

对于水平居中，您必须指定元素的width，并且不能使用float属性。