iPhoneX 安全区域 safe-area-inset-*样式不生效

iPhoneX 安全区域 ​​safe-area-inset-*​​样式不生效

解决办法： 添加 ​​meta name="viewport"​​​ 中增加​​viewport-fit=cover​​内容

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

补充 1 兼容写法

iOS 11 ​​constant(safe-area-inset-top)​​ iOS 11.2+ ​​env(safe-area-inset-top)​​

补充2 安卓

left: .6rem;
left: calc(env(safe-area-inset-left) + .6rem);
left: calc(constant(safe-area-inset-left) + .6rem);