Стиль полосы прокрутки не применяет Google Chrome ⇐ CSS

[Anonymous]

Приведенный ниже код является частью следующего проекта js, который я создаю. Код написан на TypeScript, а для оформления я использую Tailwind CSS. Я пытаюсь применить стиль к полосе прокрутки, но он не работает. По крайней мере, этого нет в Google Chrome.
Когда я открыл приложение в DuckDuckGo, оно заработало. Я, конечно, думал, что проблема в кешировании, но после очистки кеша мне тоже не повезло.
вот часть моего файла globals.css:

Код: Выделить всё

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
* {
@apply border-border;
}

body {
@apply bg-background text-foreground;
}

.custom-scrollbar::-webkit-scrollbar-thumb {

border-radius: 5px !important;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
background: #555;
}

.custom-scrollbar::-webkit-scrollbar-corner {
background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-button {
display: none;
}

.custom-scrollbar {
scrollbar-width: thin;
scrollbar-color: black transparent;
}

}

это элемент:

Код: Выделить всё

Стили .custom-scrollbar применяются, но псевдоэлементы по какой-то причине не работают в Chrome. (Chrome обновлен). При проверке элемента правила CSS присутствуют, но они не работают. Снимок экрана ниже:

Вот как это должно выглядеть:



Подробнее здесь: https://stackoverflow.com/questions/784 ... gle-chrome