Custom Scrollbars Coding Snippet

This CSS coding snippet is for changing the look of the scrollbars on your homepage. These can make a big difference when used to better match the aesthetic of your layout! The guide comments in the CSS will not show up on your page, but will stay where they are in your coding.

/* If you're on a Mac, you probably won't notice much difference as iOS software typically overrides the look of CSS scrollbars. Everyone else, though, will appreciate the customization! The first element changes the horizontal scroll bar (usually won't be seen unless your layout is very, very wide. The second element changes the background of the vertical (main) scrollbar. The third element changes the bit that you drag and it scrolls. */

::-webkit-scrollbar-thumb:horizontal {
background-color: #aaaa22;
height: 12px!important;}

::-webkit-scrollbar 
background-color: #f7f7f9;
width: 12px;}

::-webkit-scrollbar-thumb:vertical {
background-color: #aaaa22;
height: auto;}

%d bloggers like this: