0

I'm working on a web-app using ReactJS (using JS and material UI) that is intend to work on mobile screens. I'm facing a problem while opening it in iPhone's (iPhone 12, iPhone 13) chrome browser.

There's a grey bar at the bottom that is causing the issue. At the bottom of the screen I have "Button" that is being hidden behind grey area (see area pointed out by green arrow in screenshot).

Not just this screen, nearly all of my screens are rendered behind it, as result most of the functionalities are not working properly.

But this problem is not coming if I open it in laptop browser with mobile screen using developer tools.

enter image description here

Improve this question
2
  • That bar is there all the time on phones with FaceID & no Home button.
    – Tetsujin
    Dec 8, 2022 at 18:22
  • @Tetsujin The problem is that our page content is hidden behind it and it is not scrolling.
    – Ninja-aman
    Dec 9, 2022 at 9:14

0

Reset to default

You must log in to answer this question.

Browse other questions tagged .