scrollbar-gutter

Avoid content layout shifts when moving from content without a scroll to content with a scroll. MDN Spec

CSS

html {
  scrollbar-gutter: stable both-edges;
}

Demo

With scrollbar-gutter

This container has scrollbar-gutter: stable applied.

When content exceeds the container height, a scrollbar appears without shifting the content.

Without scrollbar-gutter

This container does not have scrollbar-gutter applied.

When content exceeds the container height, a scrollbar appears and shifts the content.