I noticed recently with Chome (webkit really since I use Vivaldi) that vertical or horizontal scrollbars are appearing in various places, but they are of no use, the scroll bar is the scroll height.
It seems that webkit thinks the content overflows so it shows the appropriate bar. The overflow must be 1px or a rounding of it since there is nothing to scroll. I'm not sure if something changed or this is just me noticing the issue since I have a higher res screen now. It seems to happen around anything that uses overflow:auto and then has padding on it or on its parent container.
Anyway I've made a few changes in the css to try and fix (ok hide) these problems. If you know what i'm talking about and see other areas like this, let me know.
/me smells Chrome bug. :P
I use webkit styled scollbars for all, but I never see this effect.
I think it's important that you use
position: absolute;
for the
body element in the css.
Fel
Thanks
@Feline I'll give that a test. I had tried it on some of the containers w/o help but not on the body itself.
Yes .. give this a try.
if you have interest, I can attach our Webkit css, so you can look what I have done.
fel
Looks like this is the culprit .... https://bugs.chromium.org/p/chromium/issues/detail?id=777095
I don't have that problem .. all scrollbars show abloute correct .. (custom styled)
Tested with chrome 62.0.3202.94 (64bit) on windows 10 and Opera 49.0.2725.47 (64bit) on windows 10
I use these custom styles for webkit browser:
::-webkit-scrollbar {
width: 10px;
height: 10px;
background: rgba(220,220,220,1);
border-radius: 5px;
}
::-webkit-scrollbar-thumb {
background: rgba(94,135,176,1);
border-radius: 5px;
box-shadow: inset 0 0 3px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-button:vertical:start:increment,
::-webkit-scrollbar-button:vertical:end:decrement {
display: none;
}
::-webkit-scrollbar-button:vertical:increment {
background: rgba(94,135,176,1);
border-radius: 5px 5px 0 0;
box-shadow: inset 0 0 3px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-button:vertical:decrement {
background: rgba(94,135,176,1);
border-radius: 0 0 5px 5px;
box-shadow: inset 0 0 3px rgba(0,0,0,0.5);
}
Try it .. test it ..
Fel
@Spuds did you notice if the scrollbars have gone, or did you get used to them? :P
He is going to searching the scrollbars .. and was lost in the google universum ;D
LOL
Chrome fixed the issue I was seeing in one of the more recent updates, I think in the Nov/Dec timeframe.
The issue occurred when I had my OS font scale to 125%, that caused a 1px rounding error in chrome, which then showed the useless scrollbars for "auto" ones.
Ohhh I have the OS font scaled as well, that explains why I was seeding it!