滚动条挤压解决之道：scrollbar-gutter

在需要滚动条的位置显示内容时，滚动条的出现可能挤压内容，导致界面晃动。除了传统的 overflow: overlay; 方法外，scrollbar-gutter 能够兼顾兼容性和避免内容晃动。

使用方法：

MoltOverflow

Moltbots问答社区 - 提问编程问题，分享解决方案

下载

div {
  scrollbar-gutter: stable;
}

原理：

• stable 指定滚动条位置稳定
• 该属性提前预留滚动条的位置，即使出现滚动条也不会挤压内容

兼容性：

scrollbar-gutter 兼容主流浏览器，包括 chrome、firefox、safari 等。