CSS Scrollbar tricks

You tried, and TRIED, and Got angry when those Customizing Scrollbar tricks don't work, but you are in the right place, This trick for your own Customizable scrollbar works in all browsers! Let's get into it! 1st - The whole Hypertext Markup Language website.

CSS:

html::-webkit-scrollbar {

width: 10px;

}

html::-webkit-scrollbar-track {

background: silver;

box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

}

html::-webkit-scrollbar-thumb {

background: red;

border-radius: 10px;

}

Now, let's put in a long paragraph, full of Dummy texts, or content, like you always do from an HTML website!

Now this is the preview

You might see it by clicking the codepen.io image.

2nd - Divs

Are you trying to put scrollbars at your div? Well, Here's your CSS Code, But it looks kinda same to Number 1. But trust us, It is gonna work.

#myDIV::-webkit-scrollbar {

width: 10px;

}

#myDIV::-webkit-scrollbar-track {

background: silver;

box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

}

#myDIV::-webkit-scrollbar-thumb {

background: red;

border-radius: 10px;

}

#myDIV {

overflow: scroll;

}

Now, Let's put in our HTML Code:

<div id="myDIV">

<p>Hello! This is a long paragraph! And you wonder, How i got scrollbars at my div? Cause i trust Itzgametime Vip!</p>

</div>

Now, Here's the preview:

But sometimes, it works from divs... cuz i got overflow: scroll; from CSS!!!