::webkit-scrollbar не видит css переменные

Question

::webkit-scrollbar не видит css переменные

Рейтинг: 0Ответов: 1Опубликовано: 08.08.2023

Вот тот самый фрагмент кода, в файрфоксе все почему то defined и скроллбар действительно кастомизировался

// .fs-manager scroll
.fs-manager {

  scrollbar-color: var(--color-1) var(--color-2);


  &::-webkit-scrollbar-thumb {
    background-color: var(--color-1);
  }
  &::-webkit-scrollbar-track {
    background-color: var(--color-2);
  }
}

В чем проблема?

css scss

Источник: Stack Overflow на русском

Answer 1

▲ 0Принят

Чтобы заработали вебкиты, нужно явно задать основные размеры полос прокрутки. Я добавил так:

*::-webkit-scrollbar {
  width: 12px;
}
*::-webkit-scrollbar-thumb {
  border-radius: 5px;
  border: 2px solid orange;
}

И всё нормально заработало. Ясно, что свойства указать можно у вашего класса, а не вообще, ну и размеры и цвета можно задать такие, какие именно вам нужны.

::webkit-scrollbar не видит css переменные

Ответы