Box Element causing overflows on smaller screens, even though it does not reach the end of screen
I am using Material UI with React and Webpack
On smaller screens my react box component makes the screen "expand" on the right side, and this causes the navbar to expand, and also horizontal scroll to appear, I have attached my return code, and also a few screenshots that may help.
My element
Some screenshots of the issue:
https://i.stack.imgur.com/gtmJE.png
As you see on the "right side" of the view, the different grey colour appears, and that is the place where the element overflows.
You can view the issue here: https://dev.vinu.cash/nameLookup (visible on mobile devices, on chrome selecting Galaxy S8+ (360x740) device to view on also shows the issue.
9 Replies
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Yeah, it only happens on smaller screens
can you try on chrome on desktop with samsung s8+ preview?
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Nope, both didn't help
When I remove the box component, the overflow disappears
so something with it
also happens in other places I have the box element
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
what kind of tweaks?
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Oh my god! Thank you so much! I was about to give up, and this fixed the issue 😄
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View