Horizontal scroll bar always visible and not working

[kalmykovanton]

I mentioned a strange behavior on MacBook Pro (2017) macOS High Sierra v.10.13.3, browsers: Chrome v.65.0.3325.162 and Safari v.11.0.3 (13604.5.6). When macOS's "Show scroll bars" settings "Automatically based on mouse or trackpad" or "When scrolling" are selected, horizontal scroll bar always visible and not working as expected, please see screenshots and gif below. But when I choose "Always" option, all works fine. I've reproduced this issue only on MacBook Pro Retina (2017). On macMini and PC with Ubuntu and full hd monitor all works fine. Please, help me sort out with this problem. Thanks in advance.

[dongcai]

@kalmykovanton What a coincidence! :-) I am looking for solution for this issue just now. I tried to set width='100%' and hideTracksWhenNotNeeded, but it's not working on Chrome (mac, Version 65.0.3325.162) . In my case, it works on Firefox.

I probably can hack the source code (react-custom-scrollbars.js line #1287) to be

var viewStyleDefault = exports.viewStyleDefault = {
	    position: 'absolute',
	    top: 0,
	    left: 0,
	    right: 0,
	    bottom: 0,
	   // overflow: 'scroll',
            overflow-y: 'scroll',
	    WebkitOverflowScrolling: 'touch'
	};

Since I never need scroll-x, changing it to overflow-y: 'scroll' could fix the issue, but need a better solution. Anyone?

[meikidd]

same as #281

[vadzim]

@malte-wessel is it possible to fix that? I have the same issue on linux in Chrome, but not in Firefox. The horizontal scroller appears always though it's not needed.

In function getThumbHorizontalWidth() the value trackWidth is always less then width by 1.

If I increase negative value of magrin-right of scroll div by 0.5px in dev tools then that horizontal scroller disappers.