3 ms·

scrollbar-gutter is new to me as well, and something I really want to use... but CanIUse claims it only has 66% support: https://caniuse.com/mdn-css_properties_

scrollbar-gutter is new to me as well, and something I really want to use... but CanIUse claims it only has 66% support: https://caniuse.com/mdn-css_properties_scrollbar-gutter https://caniuse.com/mdn-css_properties_scrollbar-gutter

onion2k 5y ago
And that is fine. Expecting your website to be identitical across every browser is not the goal. You need to build sites that respond to the capabilities of the user's device, and progressively enhance to get better as more features become available. If the website is less wide to account for the scrollbar on browsers where it can be that's awesome, and if it's full width on browsers that don't have the gutter feature that's OK too. Critical functionality should work everywhere. Then users should get the best experience possible that their browser supports on top of that.
- faeyanpiraat 5y ago
  I’m having trouble clicking the “need a website?” link on ooer.com on iPhone 7. Should I record a video about the issue?
  - onion2k 5y ago
    There is no critical functionality on my website. :)
    - faeyanpiraat 5y ago
      I didn’t try making a point, it was just a genuine feedback.
      - onion2k 5y ago
        Thank you. But seriously, my website only gets updated when I'm looking for a job. The rest of the time it just sits there gathering dust.
- schemescape 5y ago
  Good point, but in my case this caused a horizontal scroll bar to also appear, which looked awful, so I guess it was critical functionality to me and not just an enhancement :)
dspillett 5y ago
It is a fairly new property so it may be a while before it is ubiquitous (the MDN page links to a ticket for implementing it is Firefox where it is not yet present at all, for instance). As it is a property to reduce visual artifacts (as content length changes) it is a safe one to specify and have ignored where not supported: users of other browsers will just not get that minor benefit until the browser catches up. This may be a problem if you are trying to achieve perfectly identical presentation to all users, but you've got a lot of problems coming your way too if that is one of your goals! A browser not supporting this property of you user it is not going to break a design, not to the point of causing functionality or usability issues, unless you are doing something very strange and complex.
vince14 5y ago
Me too, that's why I always have `html { overflow-y: scroll; }`.

onion2k 5y ago

And that is fine. Expecting your website to be identitical across every browser is not the goal. You need to build sites that respond to the capabilities of the user's device, and progressively enhance to get better as more features become available. If the website is less wide to account for the scrollbar on browsers where it can be that's awesome, and if it's full width on browsers that don't have the gutter feature that's OK too. Critical functionality should work everywhere. Then users should get the best experience possible that their browser supports on top of that.

faeyanpiraat 5y ago
I’m having trouble clicking the “need a website?” link on ooer.com on iPhone 7. Should I record a video about the issue?
- onion2k 5y ago
  There is no critical functionality on my website. :)
  - faeyanpiraat 5y ago
    I didn’t try making a point, it was just a genuine feedback.
    - onion2k 5y ago
      Thank you. But seriously, my website only gets updated when I'm looking for a job. The rest of the time it just sits there gathering dust.
schemescape 5y ago
Good point, but in my case this caused a horizontal scroll bar to also appear, which looked awful, so I guess it was critical functionality to me and not just an enhancement :)

dspillett 5y ago

It is a fairly new property so it may be a while before it is ubiquitous (the MDN page links to a ticket for implementing it is Firefox where it is not yet present at all, for instance). As it is a property to reduce visual artifacts (as content length changes) it is a safe one to specify and have ignored where not supported: users of other browsers will just not get that minor benefit until the browser catches up. This may be a problem if you are trying to achieve perfectly identical presentation to all users, but you've got a lot of problems coming your way too if that is one of your goals! A browser not supporting this property of you user it is not going to break a design, not to the point of causing functionality or usability issues, unless you are doing something very strange and complex.

vince14 5y ago

Me too, that's why I always have `html { overflow-y: scroll; }`.