scrollbar-width

scrollbar-width позволяет изменить ширину полосы прокрутки.

        
          
          html {  scrollbar-width: thin;}
          html {
  scrollbar-width: thin;
}

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

У scrollbar-width есть 3 возможных значения:

1. auto — дефолтное значение. Браузер отрисует обычный скроллбар.
2. thin — браузер отрисует тонкий скроллбар.
3. none — скроллбар не будет отрисован. При этом контент по-прежнему можно будет прокрутить.

Вот как они выглядят рядом:

Значение none не рекомендуется использовать. Мы должны явно дать пользователю понять что контент в каком-то блоке выходит за его границы, и ему нужно пролистать, чтобы увидеть остальное. Если просто убрать скроллбар, то это только запутает пользователей. К тому же если пользователь использует только мышь, то этот контент может оказаться недоступным (вдруг у него сломалось колесо прокрутки).

В целом, с шириной полосы прокрутки нужно обращаться очень осторожно. Даже если просто сделать её тоньше, мы можем создать проблемы с доступностью — пользователям буквально сложнее попасть мышью в тонкий ползунок. Убирая ползунок совсем, мы должны не допускать того, чтобы контент за пределами видимой области стал недоступен.