Chrome地址栏在移动网站上留下空白答案

【问题标题】：Chrome address bar leave a white space on mobile siteChrome地址栏在移动网站上留下空白
【发布时间】：2017-02-22 14:04:00
【问题描述】：

我在移动网站上遇到了 Google Chrome 的地址栏问题。我的网站上有一个固定的导航栏，此刻我向下滚动并且地址栏消失，当我打开我的菜单时，底部出现一个空白（地址栏的大小），我需要向上滚动以使地址栏出现，从而删除了空白。这是我的菜单 CSS：

#menu {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  z-index: 10000;
  padding: 0;
  background-color: blue;
  overflow-x: hidden;
  overflow-y: auto; 
}

其他网络浏览器在移动设备上运行良好，我该怎么做才能摆脱地址栏空白？

【问题讨论】：

标签： javascript jquery html css google-chrome

【解决方案1】：

我在升级 Chrome 后遇到了同样的问题。我通过将位置更改为固定来解决它。

https://developers.google.com/web/updates/2016/12/url-bar-resizing

【讨论】：

是的！这终于奏效了。作为记录，我将所有内容放在一个根 div 中，宽度和高度为 100%，并且位置固定。
SO 上不允许仅链接答案。链接会随着时间的推移而失效。使用您的链接作为参考形成您自己的答案，或者完全删除它。 stackoverflow.com/help/how-to-answer
@jahooma 谢谢！感谢您，我解决了 React Chrome Mobile Position Fixed 问题:) #root{ position: fixed; width: 100%; height:100%; }