Подтвердить что ты не робот

Белые углы webkit-scrollbar

Fiddle

Я использую ::-webkit-scrollbar, чтобы создать пользовательскую полосу прокрутки в Chrome. У меня есть border-radius: 10px, и при этом в верхней части находятся белые углы:

It's kinda hard to see

Извините, это довольно сложно увидеть, поскольку это полоса прокрутки.

Я хочу, чтобы углы были того же цвета, что и заголовок div (#dadae3). Есть ли способ избавиться от белых углов с помощью CSS только без изменения стилей полосы прокрутки?

CSS (весь):

body {
  padding: 0;
  margin: 0
}
::-webkit-scrollbar {
  width: 13px;
}
::-webkit-scrollbar-track {
  background: #ffffff;
  border-radius: 10px;
  border: 1px solid #aeaeb5
}
::-webkit-scrollbar-thumb {
  background: #dadae3;
  border-radius: 10px;
  border: 1px solid #aeaeb5
}
::-webkit-scrollbar-thumb:hover {
  background: #c4c4cc
}
::-webkit-scrollbar-thumb:active {
  background: #aeaeb5
}

HTML:

<div style='background: #dadae3; width: 100%; height: 30px;'></div>
<div style='width: 100%; height: 1000px'></div>
4b9b3361

Ответ 1

Вы должны установить псевдо-элемент ::-webkit-scrollbar-corner, например

::-webkit-scrollbar-corner { background: rgba(0,0,0,0.5); }

Ответ 2

Вы можете установить свойство background-color для псевдоэлемента -webkit-scrollbar, делая это, вы можете установить "цвет угла".