css - iOS Chrome 不尊重缺口的安全区域插入

Question

我有一个问题，Chrome 的横向版本在我的屏幕左右添加了空白。

以下是规格：

我有一个“厨房水槽”方法，我已经尝试了一切来删除这些白条并使背景全屏。

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">

以及以下 CSS：

html{
  margin: env(safe-area-inset);
  padding: env(safe-area-inset);
}


html, body, img{
  width: 100%;
  height: 100%;
  margin: 0;
  box-sizing: border-box;
  padding: 0;
  width: 120vw;

}

img{
  margin: env(safe-area-inset);
  object-fit: cover;
}

这是一个现场演示：

https://codepen.io/EightArmsHQ/pen/JjYygPg

我在iOS Safari中取得了不错的成绩，但似乎止步于此。已经提出了类似的问题env(safe-area-inset-top) not working on Android Pie + WebView 69

我想知道这是否是 Chrome iOS 错误，或者我的实现是否不正确。值得注意的是，Safari在添加这些属性时确实会删除空格。