页面上的Div中心适用于桌面，但不适用于移动设备

Question

为什么：

  <div class="page" role="main">
    <div class="gallery">
    </div>
  </div>

和这个CSS：

.page {
  width: 100%;
  height: 100%;
}

.gallery {
  margin: 0 auto;
  width: 320px;
}

在桌面浏览器中工作，但在iphone sfari中不起作用？

在桌面浏览器上，它以移动设备为中心，与右侧对齐，就像没有居中一样 是否有更好的方法将主要div放在页面上？

Answer 1

试试这个

.page
{ 
width: 100%;
height: 100%;
text-align:center;
margin:auto;
}

.gallery {
  margin: auto;
  width: 320px;
}