Safari 27.1 ships a Device Posture API for the new foldable iPhone

Safari 27.1, released on 23 October alongside the iPhone Duo, ships the first WebKit support for detecting a folded screen on the web. The new device-posture media query and navigator.devicePosture.type report one of two values: folded, when the device is held in a book or laptop pose, or continuous, when the screen is flat.

Alongside it, a Viewport Segments API adds horizontal-viewport-segments and vertical-viewport-segments media queries, plus six environment variables (viewport-segment-width, -height, -top, -right, -bottom, -left) for styling each half of a folded display. In JavaScript, window.viewport.segments returns the segments as an array of DOMRect objects. Both APIs ship behind feature flags, toggled in Settings > Apps > Safari > Advanced > Feature Flags. Safari’s own PDF viewer already uses the posture signal, switching to a two-page book layout when the phone is folded.

@media (device-posture: folded) {
  .layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

Why it matters: this is the first time a shipping browser has exposed fold state to CSS and JavaScript. If you build anything with a two-pane layout, a reading view, or a PDF-like viewer, there is now a standards-track way to adapt to a folded device instead of guessing from viewport width.

The caveat: both APIs are behind feature flags on one device, so nothing can be shipped against them yet. No other browser has announced support.