Auto hide scrollbars in IE & Edge

Elements
1

I found this : -ms-overflow-style: -ms-autohiding-scrollbar

Where do I place this to affect all the scrollbars. It looks great on the mac but crap on a PC ( why???).

Cheers

Steve Warby.

2

Hi Steve:

Can you explain in more detail what you’re seeing, what you don’t want to see, and what browsers (and versions) you’re seeing it in? Images help! You can add CSS to the head by adding it to a style block:

<style>
-ms-overflow-style: -ms-autohiding-scrollbar
</style>

You can edit the contents of the <head>…</head> of your exported .html file by clicking on ‘Edit HTML Head’ in the Document Inspector.

3

Thanks,

I’ll try that tonight.

Cheers

Steve Warby

4

hi @Daniel!
i use a html-widget with class “scroll” - in head i write:
.scroll{ /*webkit iOS,Chrom*/ overflow-y: scroll; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } }
but it doesn´t work on firefox 45.0 - the scrollbars are shown.
how do i prevent this issue?

5

There’s unfortunately no simple or straightforward way to do this. Here’s a long discussion on this topic:

And, boy have things gotten angry on Firefox’s bugzilla thread on style-able scrollbars:

https://bugzilla.mozilla.org/show_bug.cgi?id=77790

6

ok, so the best way would be - group a html-widget and set the Content overflow of the group to hidden,
then reduce the size of the groups rectangle to not see the scrollbars of the html-widget :imp: