Safari中的按钮不居中对齐

Question

仅在 Safari 浏览器中按钮不居中对齐。

JSFIddle

HTML

<div class="" style=" width: 100%; ">
    <input value="Button" class="center-block" type="submit" style=""/>
</div>

CSS

.center-block {
display: block;
margin-right: auto;
margin-left: auto;
}

上述问题只是在 Safari 中出现。在 Chrome 和 Firefox 中运行良好。

Answer 1

如果你没有为 btn 设置宽度：

1. 父级 - text-align: center
2. 按钮子 - 使用 display:inline-block 而不是 display: block

.wrap {
    text-align: center;
}
.center-block {
    display: inline-block;
}

<div class="wrap">
    <input value="Button" class="center-block" type="submit" />
</div>