在Safari中按钮不居中对齐

时间:2015-06-22 10:34:49

标签: html css safari center-align

按钮未在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中,它可以正常工作。

1 个答案:

答案 0 :(得分:9)

如果您没有为btn设置宽度:

  1. parent - text-align: center
  2. 按钮子项 - 使用display:inline-block代替display: block
  3. &#13;
    &#13;
    .wrap {
        text-align: center;
    }
    .center-block {
        display: inline-block;
    }
    &#13;
    <div class="wrap">
        <input value="Button" class="center-block" type="submit" />
    </div>
    &#13;
    &#13;
    &#13;