Scrollbar margin disappears ?
Does anyone know how to fix this ?
When I refresh page multiple times the white corner appears + horizontal scrollbar + vertical scroll bar left margin disappears.
In one of the images you can see that it is not all the time. When I hover over side navigation bar, the navigation bar expands and it fixes itself or when I go to developer tools. Not sure what causes this.
I use for scrollbar overflow-y: auto + max-height as 100vh - 5.125rem because of margins and borders
3 Replies
I managed to fix the color with -webkit-scrollbar-corner
I think I found problem. The problem is overflow-y: auto. When I changed from auto to scroll it seemed to fix the issue. If anyone know why let me know. Thanks.
Tho the behaviour is changed which is not what I wanted.
Alright I tried just new thing and I set x to hidden and y to auto and it seems to fix the horizontal issue tho now when I refresh there is missing margin
AHAHAHA.
What kind of shenanigans is this. @Kevin
Sorry to ping you this but would really like to find out why this is happening or a video.
Alright so I have container with padding of 1rem and inside container there is items container with this class:
I tried using overflow-y-auto which seems like it works but when you spam refresh page the horizontal bar appears + white corner appears + vertical padding right 1rem disappears. I would like to know why all of these things happen.
My assumption is some rendering issue.
And this is how I fixed it:
Not sure why this is working either. If I remove mr-4 or pr-4, the padding is not working anymore, nor margin. For some reason both has to be present.
I thought to put it twice margin or twice padding but it didn't fix the issue. On the margin case nothing happened and on padding sometimes made it look like 1rem and sometimes 2rem.
I tried to change w-full to overflow-x-hidden but the issue remain so w-full is a must too.
Sorry for a long message. I am REALLY CURIOUS what is going on here.
Or this is the issue entirely different and a result of overusing min-content and max-content on grids 😄
Never mind sorry for pinging the only thing it masked the issue while the scroll bar is "fixed" I realized the content size changes it gets bigger for some reason.
The issue was smaller then it suppose to be it fixed everything with min-w-max
To be more precise to the main container not to the items container.
if you want people to actually help you maybe provide a codepen/github/live site where people can play with it. The lack of info is preventing people from helping you 😉 #how-to-ask-good-questions
Good point. I keep forgetting. Thank you for reminder.