为什么我的网站的20px正确填充在iPhone上被切断了？

Question

基本上，这就是发生的事情：

浏览器：

Iphone（在Android中不会发生）：

我正在使用它：

<meta name="viewport" content="user-scalable = yes">

这就是CSS：

html,
body,
#wrapper {
  height: 100%;
}

body > #wrapper {
  height: 100%;
  min-height: 100%;
}

#content {
  clear: both;
  padding-bottom: 36px;
}

#header,
#content,
#footer {
  padding-left: 20px;
  padding-right: 20px;
}

.container {
  margin: 0 auto;
  width: 960px;
}

#footer {
  background: url(images/footer_bg.png) repeat-x 0 0;
  margin: -65px 0 0;
  padding: 15px 0 14px;
  position: relative;
  clear: both;
  height: 36px;
}

实时样本：

http://www.pixelmatic.com/games/

到目前为止，我很困惑。可能是什么原因？

Answer 1

我认为.container样式的容器宽度是一个问题，因为它是像素而不是百分比。 尝试使用百分比宽度。