html - 固定宽度 div 中的居中按钮在 ipad 中向左移动

Question

div 中有一个按钮，由 包围<section>：

<div id="body">
    <section>
        <div class="area">
            <button>Hello!</button>
        </div>
    </section>
</div>

,#body它<section>有一个固定的宽度并且.area有一个 50px 的内边距：

#body{
width:600px;
margin:0 auto;
background:#eee;
}
section{
width:300px;
margin:0 auto;
background:#FFF;
}
.area{
padding:50px;
}
button {
display: block;
margin: 0 auto;
}

一切都在我的显示器中完成，按钮完美居中。但在 ipad 上它向左移动：

你可以看到这个案例：http: //jsfiddle.net/c2HLe/

Answer 1

如果你不使用 CSS 重置，你可能想试试看是否有一些浏览器标准弄乱了你的布局。