La propriété CSS scrollbar-gutter: stable est présentée comme une solution pour éviter les décalages de mise en page causés par l'apparition ou la disparition des barres de défilement. Elle permet de réserver un espace fixe pour ces barres, garantissant ainsi une largeur de page constante. Cette approche remplace les méthodes anciennes et peu élégantes comme overflow-y: scroll.

Cependant, l'auteur découvre un comportement inattendu sur macOS : lorsque l'utilisateur débranche sa souris, le système passe en mode overlay scrollbars, dessinant les barres par-dessus le contenu sans réserver d'espace. Résultat, la mise en page s'élargit soudainement de 15 pixels, malgré l'application de scrollbar-gutter: stable. Ce phénomène est observable dans Safari, Chrome et Firefox, suggérant une conformité à la spécification macOS plutôt qu'un bug des navigateurs.

Le problème réside dans l'interprétation trompeuse du terme stable. La propriété ne garantit une stabilité que si le système utilise des barres de défilement classiques. Dès qu'il bascule en mode overlay (par exemple, en débranchant une souris), l'espace réservé disparaît, invalidant l'effet recherché. La spécification précise que scrollbar-gutter: stable ne fonctionne que lorsque des barres classiques existent, ce qui n'est pas toujours le cas.