Fix UI - margins are collapsing on Firefox browser

[LunarMarathon]

Expected:

[sri-rishi]

I think issue in chrome is also

I want to work on this issue, can you assign me?

[LunarMarathon]

@sri-rishi Scroll to the other end and let me know.

Yeah, sure thing. I've assigned it to you~

[sri-rishi]

Hey @LunarMarathon below this is happening because of scrollbar is getting out of container

So I have customized scrollbar, let me know what do you think

and for issue in firefox, only two value are supported by firefox

• scrollbar-width
• scrollbar-color

I have searched all come to this conclusion that You can't achieve that in Firefox using css.

here is relative link for that- https://stackoverflow.com/questions/72181404/custom-firefox-scrollbar-border-radius

[sri-rishi]

I am suggesting these two designs

For chrome and other browser

For Firefox

Please let me know what you think so I will raise PR then

[LunarMarathon]

Hey, idk what you mean by -

because of scrollbar is getting out of container

If you check my screenshots in the description of the issue, the scrollbar is within the container itself.

The issue isn't about styling the scrollbar in firefox. It's this -

This gap appears only in chrome and not in firefox. This is how it is in firefox:

(There's no gap in between the table and container)

If you inspect and see, you'll notice that the margin of the table is outside the container

[sri-rishi]

Oh sorry I misunderstood, I will look into it

[sri-rishi]

Hey @LunarMarathon, I am unable solve this issue, I have tried several method, but issue remains same also couldn't find any thing related to this, so I am unassign me, Sorry for any trouble

[LunarMarathon]

@sri-rishi Thanks a lot for trying, I had tried and wasn't able to fix it either. But since you've already tried something for the scrollbar, would you like to merge that if it's working fine?

[sri-rishi]

Yep sure, I am gonna raise PR for that