iOS: Bottom tabbar gets too much bottom offset

[lroal]

Notes

• This appears to be iOS-specific
• The problem is visible in the attached screenshot
• I am not adding custom CSS to the toolbar/tabbar itself
• It looks related to bottom safe-area handling or toolbar positioning

Reproduction

1. Create a Framework7 Svelte app with iOS theme
2. Add a bottom Toolbar with tabbar
3. Run the app inside Capacitor on iOS
4. Observe that the bottom toolbar is positioned too high above the bottom edge

Question

Is this expected with iOS safe area handling, or could the bottom toolbar be getting too much bottom offset on iOS?

[lroal]

This seemed to do the trick. Is it correct to do this or is there something wrong with F7 ?

.ios {
  --f7-safe-area-bottom: 0px;
}

[ichuot]

This seemed to do the trick. Is it correct to do this or is there something wrong with F7 ?

.ios {
--f7-safe-area-bottom: 0px;
}

Thanks a lot! I'm running into this issue on cordova@15.0.0 (SDK 36) + f7 9.0.3, whereas it works fine on cordova@14.0.0 (SDK 35). Hope this gets fixed soon!

[nolimits4web]

This issue was incorrectly closed on 2026-05-19 by a compromised credential (Shai-Hulud npm supply-chain worm). Reopening — apologies for the noise.