边距：0 自动；在 Firefox 和 Safari 中不起作用。适用于谷歌浏览器答案

【问题标题】：margin: 0 auto; isn't working in Firefox and Safari. Works in Google Chrome边距：0 自动；在 Firefox 和 Safari 中不起作用。适用于谷歌浏览器
【发布时间】：2017-01-07 02:56:22
【问题描述】：

这是我的页面：http://inventikasolutions.com/demo/tatasky

蓝色按钮在 Google Chrome 中居中显示，但在 Safari 和 Firefox 中它浮动到左侧。

我使用的是最新版本的浏览器。

我的css代码是：

.messi .btn {
background-image: url(submit.png);
background-repeat: no-repeat;
background-size: auto;
background-position: -1px -490px;
background-color: #5B74A8;
border-color: #29447E #29447E #1A356E;
color: white;
font-size: 15px;
padding: 10px;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .1);
border: 1px solid #999;
vertical-align: middle;
line-height: 20px;
margin: 0 auto;
display: block;
}

.messi-actions .btnbox .btn {
min-width: 75px;
}

谢谢

【问题讨论】：

标签： css google-chrome firefox safari

【解决方案1】：

Firefox 以不同的方式呈现 btn 周围的 div 标签。所以它将它与它的包装 div 标签的中心对齐，但该标签只是按钮的宽度并且左对齐。添加它以使其正常工作：

.mesi-footbox {
    text-align: center;
}

如果 div 没有呈现全宽，这将使 div 居中，或者在 chrome 中保持相同。

【讨论】：

您的编辑在 Firefox 上有效，但 Safari 仍然损坏。 Safari 也使用 webkit，为什么它不能正确渲染布局？ Chrome 正在以应有的方式呈现它。

【解决方案2】：

@Pritesh Desai 尝试放入野生动物园文本对齐：居中；到包含要居中的 div 的容器 div

【讨论】：