How to Prevent Scrollbars on iPhone X and Later in ReactJS Apps

19 views Asked by At

When I open my ReactJS app on iPhone X and later models, it consistently displays a scroll bar even though it is set to full screen. This issue might be occurring due to the iPhone's notch, which causes the height calculation to be longer than the actual visible area.

I'm seeking a solution to ensure that my ReactJS app accurately determines the height and eliminates the bothersome scroll bar.

For reference, please see the attached screenshot. https://youtube.com/shorts/xVcyjGu2_0I?feature=share

1

There are 1 answers

0
Liheng On

When I change width:"100vw" and height:"100vh" to width:"100dvw" and height:"100wvh". It works