Skip to main content
Topic: Chrome's crazy scrollbars (Read 1746 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Chrome's crazy scrollbars

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. 
Be safe, Be kind, Happy Programing

Re: Chrome's crazy scrollbars

Reply #1
 emanuele smells Chrome bug. :P
Bugs creator.
Features destroyer.
Template killer.

Re: Chrome's crazy scrollbars

Reply #2
I use webkit styled scollbars for all, but I never see this effect.
I think it's important that you use 

Code: [Select]
position: absolute;

for the body element in the css.

Fel
Many are stubborn in relation to the path, a few in relation to the target.
Visit our new Forum Project on https://www.portamx.com

Re: Chrome's crazy scrollbars

Reply #3
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.
Be safe, Be kind, Happy Programing

Re: Chrome's crazy scrollbars

Reply #4
Yes .. give this a try.
if you have interest, I can attach our Webkit css, so you can look what I have done.

fel

Many are stubborn in relation to the path, a few in relation to the target.
Visit our new Forum Project on https://www.portamx.com


Re: Chrome's crazy scrollbars

Reply #6
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:
Code: [Select]
::-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
Many are stubborn in relation to the path, a few in relation to the target.
Visit our new Forum Project on https://www.portamx.com

Re: Chrome's crazy scrollbars

Reply #7
@Spuds did you notice if the scrollbars have gone, or did you get used to them? :P
Bugs creator.
Features destroyer.
Template killer.


Re: Chrome's crazy scrollbars

Reply #9
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.
Be safe, Be kind, Happy Programing

Re: Chrome's crazy scrollbars

Reply #10
Ohhh I have the OS font scaled as well, that explains why I was seeding it!
Bugs creator.
Features destroyer.
Template killer.