Fair enough :-)

I know what you mean, but I tested before posting here... And, if will do like that, we can add an condition for if mobile :)

@PickOne

I don't recommend hiding overflow. This will remove the ability to scroll content manually, which is bad for mobile users.

Best,

Christopher

For firefox:

@-moz-document url-prefix() {

 body {overflow:hidden;}

 }

For Internet Explorer (because is not working here either)

body{-ms-overflow-style: none;}

Chrome remain the same what "ckurose" said:

::-webkit-scrollbar {
    display: none;
}

Good luck!

:-)

Yes :( that was what i know also, but still, i just thought... Anyway, i made it with an extra plugin where i made the scrollbar 0px

Hi there,

FireFox does not currently provide an ability to customize the scrollbar via CSS.

Best,

Christopher

What about firefox? :D

Thanks for sharing! ;-)

To hide the scrollbar (in Chrome on OSX at least, doesn't work for Safari as Christopher mentions):

1. In your Wordpress Dashboard, go to Appearance>Editor and choose the Stylesheet (style.css) at the bottom right to edit

2. Cmd + F and type "scrollbar" - should give you 8 result, click through to the 2nd one which should be a heading for "SCROLLBAR STYLES FOR WEBKIT ONLY"

3. Within this section, but not within any of the existing "body.windowsOs..." thingys, paste this:

::-webkit-scrollbar {
    display: none;
}

4. That whole section should look like this after:

/*-------------------------------------*/
/*--SCROLLBAR STYLES FOR WEBKIT ONLY--*/
/*-----------------------------------*/

::-webkit-scrollbar {
    display: none;
}

body.windowsOs *::-webkit-scrollbar {
    width: 5px;
}
body.windowsOs *::-webkit-scrollbar:horizontal {
    height: 5px;
}
body.windowsOs *::-webkit-scrollbar-track {
    background: none;
}
body.windowsOs *::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background:rgba(0,0,0,1);
}
body.windowsOs *::-webkit-scrollbar-thumb:hover {
    background: rgba(0,0,0,1);
}

5. My result with hidden scrollbar but ability to scroll horizontally here: http://chriskurose.com/category/projects/

Regarding scroll bars...

Each OS (and browser) treats scroll bars differently. For example, Mac OS has a system setting that allows you to control if scroll bars are hidden or visible on the page. In addition to OS system settings, each browser displays scroll bars a little bit different. Some have transparent bars that fade away when you're done scrolling and others have old-school blue and bulky scroll bars at all times (sexy, right?...not so much).

Please keep in mind: scroll bars are a system-controlled element, not a theme-controlled element. Currently only one browser (Chrome) allows CSS to control some elements of the scroll bar design, but this option is currently very limited. There are some popular approaches that hide the scroll bars and utilize JavaScript to add 100% custom scroll bars, but this approach is VERY buggy and causes issues on most mobile devices.

If you think your site has issues, please provide the details of both the OS and web browser that you're using and I'll be sure to check it out for issues. As always, please be sure to compare the performance of your site against the demo site for reference: http://themes.themolitor.com/vysual

Best,

Christopher