iPhone 11 Pro Max vs iPhone 15 Pro Max: screen size and viewport
The iPhone 11 Pro Max lays web pages out at 414 × 896 CSS px with a pixel ratio of 3; the iPhone 15 Pro Max at 430 × 932 with 3. The iPhone 15 Pro Max is 16 px wider and 36 px taller.
The two screens side by side
Specs compared
| Spec | iPhone 11 Pro Max | iPhone 15 Pro Max | Difference |
|---|---|---|---|
| Viewport, portrait (CSS px) | 414 × 896 | 430 × 932 | −16 px wide, −36 px tall |
| Device pixel ratio | 3 | 3 | same |
| Physical resolution | 1242 × 2688 | 1290 × 2796 | iPhone 15 Pro Max: 8% more pixels |
| Aspect ratio | 19.5:9 | 19.5:9 | about the same |
| Visible height, portrait, with browser bars | ~719 px | ~742 px | −23 px for the iPhone 11 Pro Max |
| Landscape width (CSS px) | 896 px | 932 px | −36 px for the iPhone 11 Pro Max |
| Visible height, landscape | ~364 px | ~380 px | −16 px for the iPhone 11 Pro Max |
| First released | 2019 | 2022 | 3 years apart |
| Engine in MobileCheck | WebKit (Safari) | WebKit (Safari) | same engine |
CSS px are the units media queries see. Visible heights subtract the status bar and the Safari on iOS bars as set in our device profiles; real bar heights vary with settings and scrolling. The release year is that of the first model with each screen.
What this means for your layout
How the width difference affects your layout
The iPhone 15 Pro Max is 16 CSS px wider (430 vs 414, 4% more). One common breakpoint falls between them: (min-width: 430px) (a common large-phone test width) matches the iPhone 15 Pro Max but not the iPhone 11 Pro Max, so a rule written for that width applies on only one of the two.
In a 2-column card grid with 16 px page padding and 16 px gaps, each card is 191 px wide on the iPhone 15 Pro Max and 183 px on the iPhone 11 Pro Max. Check that buttons, prices and long words still fit in the narrower one.
Pixel density and image sizes
Both draw each CSS pixel with 3 × 3 device pixels, so text and icons are equally sharp. A full-width image (sizes="100vw") needs about 1242 px on the iPhone 11 Pro Max and 1290 px on the iPhone 15 Pro Max to look sharp.
With a srcset such as 640w, 828w, 1080w, 1290w, 1440w, 1640w, 2048w, the browser would normally pick the 1290w file on the iPhone 11 Pro Max and the same one on the iPhone 15 Pro Max.
Above 2× most people can't see much difference in photos, so capping photo candidates around twice the CSS width saves bytes on both. Keep SVG for icons and logos: they stay sharp at any ratio.
How much fits above the fold
On first load about 742 px of the page is visible on the iPhone 15 Pro Max and 719 px on the iPhone 11 Pro Max: 23 px less (3%) on the iPhone 11 Pro Max. That's less than one line of body text, so in practice both show the same first screen.
In landscape
Turned sideways, the iPhone 11 Pro Max is 896 px wide and the iPhone 15 Pro Max 932 px. The visible height drops to about 364 and 380 px, so a 64 px sticky header covers 18% and 17% of the screen — under the 25% at which MobileCheck flags fixed bars covering the page.
Same browser engine
Both are Apple devices, so both render with WebKit, the engine behind Safari. Engine quirks are the same; the differences above come from size alone. Chrome DevTools only emulates the size and still draws with Chromium, so check Apple devices in a WebKit browser — see how to test on an iPhone.
More about these devices
- iPhone 11 Pro Max viewport size — one screen for the iPhone 11 Pro Max / XS Max
- iPhone 15 Pro Max viewport size — one screen for the iPhone 14 Pro Max / 15 Plus / 15 Pro Max / 16 Plus
Or open the free check with the iPhone 11 Pro Max and the iPhone 15 Pro Max preselected: full-page screenshots in WebKit, with problems such as small text and crowded buttons highlighted.
Related comparisons
- iPhone 15 Pro Max vs Galaxy S24 Ultra — 430 vs 384 px wide, 3× vs 2.813×
- iPhone 15 Pro vs iPhone 15 Pro Max — 393 vs 430 px wide, 3× vs 3×
- iPhone 15 Pro Max vs iPhone 16 Pro Max — 430 vs 440 px wide, 3× vs 3×
- iPhone 13 Pro Max vs iPhone 14 Pro Max — 428 vs 430 px wide, 3× vs 3×
Compare other devices → · All mobile viewport sizes →
Frequently asked questions
Is the iPhone 11 Pro Max screen bigger than the iPhone 15 Pro Max?
In CSS pixels, which decide how much of a page fits, the iPhone 15 Pro Max is larger: 430 × 932 against 414 × 896. The iPhone 15 Pro Max has more physical pixels (1290 × 2796), which makes it sharper rather than roomier.
Do I need different CSS for the iPhone 11 Pro Max and the iPhone 15 Pro Max?
Only if your breakpoints fall between 414 and 430 px: a min-width query at 430px applies to one and not the other. A fluid layout handles both without device-specific rules.
How much of a web page is visible on the iPhone 11 Pro Max vs the iPhone 15 Pro Max?
About 414 × 719 CSS px on the iPhone 11 Pro Max and 430 × 742 on the iPhone 15 Pro Max when a page first opens in portrait, after the status bar and Safari on iOS's bars. Bar heights are our device profiles' estimates.