Viewport Height Issue on Mac (Safari)

[alexdeploy]

Description

The page's viewport height is not displaying correctly on Safari (Mac). After investigating, I found that the #nuxt element has height: 100%, which works fine in Chrome but not in Safari. If this property is disabled in Chrome, the height matches what is seen in Safari.

Steps to Reproduce

Open the application in Safari on Mac. Compare the viewport height with how it appears in Chrome. In Chrome, disable the height: 100% property of #nuxt in DevTools. The height in Chrome will then match Safari’s height.

Expected Behavior

The viewport height should be consistent across browsers, particularly between Chrome and Safari.

Actual Behavior

On Safari (Mac), the viewport height is shorter than expected. On Chrome, the height appears as intended, but disabling height: 100% on #nuxt causes it to match Safari’s behavior. Possible Fix

Further investigation is needed to determine a cross-browser solution, possibly using min-height: 100vh or other CSS techniques that ensure consistency.

Environment

Browser: Safari (Mac) OS: macOS Sequoia

Would appreciate any insights or fixes on this issue! 🚀