Bug 300523 – REGRESSION (iOS 26): Safari on iPhones with Dynamic Island shifts the viewport upward when scrolling or closing the keyboard

• Status: NEW
• Component: Layout and Rendering

On iPhones with the Dynamic Island (tested on iPhone 15 Pro, iOS 26), Safari incorrectly calculates the visual viewport height after rendering or after the on-screen keyboard closes. The visible area slightly shifts upward (by a few pixels), causing fixed or sticky headers to move into the safe area under the Dynamic Island.

This behavior does not occur on older iPhones without the Dynamic Island (e.g., iPhone 13 Pro Max on iOS 18).

Steps to reproduce:
1. Open website with a fixed or sticky header (example: https://www.florasweets.de)
2. Scroll down and up several times, or open and close an input field (triggering the keyboard)
3. Observe that after closing the keyboard or re-rendering, the header area shifts upward into the safe-area zone.

Expected behavior:
The visual viewport should remain stable, respecting the safe-area-inset-top and keeping fixed/sticky elements aligned with the visible viewport edge.

Actual behavior:
Safari miscalculates the top offset and repositions the visual viewport, pushing content into the safe-area region under the Dynamic Island.

Reproducible: Always (100%) on iPhone 15 Pro with iOS 26  
Not reproducible on iPhone 13 Pro Max, iOS 18.  

Additional notes:

viewport-fit=cover and viewport-fit=contain do not fix the issue.

Applying env(safe-area-inset-top) padding or JS recalculations (window.visualViewport) doesn’t solve it either.

The issue seems to be related to how WebKit recalculates the layout viewport after changes to system UI (Dynamic Island expansion or keyboard close).

[Radar WebKit Bug Importer]

<rdar://problem/162396204>

[Simon Fraser (smfr)]

Please test the iOS 26.1 beta, where this should be fixed.