cssgoogle-chromewebkit

How to control a color of a box in a scrollbar corner?

Is there any way to avoid the default white box that appears on a custom styled webkit scroll bar?

The white box only appears when overflow is going both horizontally and vertically. (Using Google Chrome)

Edit: I have tried setting body background to a different colour - still only seeing a white box.

Screenshot: enter image description here

CSS:

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: rgba(0,0,0,0.35);
}
::-webkit-scrollbar-corner {
  background: #0c0c0c;
}
Solution

  • While the answer provided by E.C.Pabon was technically correct, the real error was Chrome 50 on x64 Linux had a bug with GTK integration. As of Chrome 51, the issue has been fixed.