Flexbox sometimes not filling full height on iOS

[julianflapper]

Hi,

I have a flexbox layout with a navbar on top and a content section below.
The content section has all the properties to make it fill (flex grow 1 and flex basis 1 1) the entire screen.
This works fine on the web (Safari, Chrome, Firefox) and on Android, and in the iOS device simulator. However, on some occasions on a real iOS device, the content section that should fill all the leftover space, only fills half of the screen.

Is this a common issue? How could I fix this?

The entire layout is flex based with Bootstrap utility classes:

    <div id="app" class="d-flex flex-column overflow-hidden">
        <div id="nav">
            <navbar-main></navbar-main>
        </div>
        
        <div class="flex-grow-1 flex-fill d-flex flex-column overflow-auto position-relative">
            
            <router-view/>

        </div>
    </div>