Ionic 5 - Tabs - tab bar hidden on mobile browsers when scrolling down

(version Ionic v5)

I have an app with a tab bar at the bottom of the screen.

Just deployed my app to the web just for a look at it. When I go to url in my desktop browser the tab bar sticks to bottom at all times as expected. However, when I check it on on mobile browser the tab bar scrolls off screen when I scroll down the page. when I scroll up it reappears and sticks to the bottom as expected. It seems to be related to when the url bar at the top of the screen appears/disappears - when it appears (on scroll down) it pushes the tab bar out of visible frame. Is there any way to prevent this from happening - specifically for mobile browsers!?