iPhone 18 Pro Max Screen Size & Viewport

Why this viewport matters

When a user visits your site on the iPhone 18 Pro Max, the browser reports window.innerWidth = 440 and window.devicePixelRatio = 3. Your CSS media queries match against the 440px CSS width, not the 1320 × 2868 physical pixel count of the panel.

At 440px it hits no Tailwind breakpoint (base styles only) and no Bootstrap breakpoint. Rotated to 956px it moves to Tailwind md, so check both orientations.

For sharp full-width images, serve a source at least 1320px wide (440 CSS px × 3 DPR) through srcset and let the browser pick it.

/* iPhone 18 Pro Max: 440×956 CSS px, DPR 3 */
@media (max-width: 440px) {
  /* styles for this width and narrower */
}

@media (min-resolution: 3dppx) {
  /* serve high-density assets */
}