CSS viewport 412 × 960 pixels at 2.625× device pixel ratio. The exact size browsers report on the Samsung Galaxy Z Fold 7 (folded).
The Samsung Galaxy Z Fold 7 (folded) viewport is 412 × 960 CSS pixels (960 × 412 rotated), with a device pixel ratio of 2.625 on a 1080 × 2520 pixel 6.5″ display. Estimated from physical resolution ÷ default DPR; the browser-reported value may differ by a few pixels.
Test your site at Samsung Galaxy Z Fold 7 (folded) (412 × 960)
When a user visits your site on the Samsung Galaxy Z Fold 7 (folded), the browser reports window.innerWidth = 412 and window.devicePixelRatio = 2.625. Your CSS media queries match against the 412px CSS width, not the 1080 × 2520 physical pixel count of the panel.
At 412px it hits no Tailwind breakpoint (base styles only) and no Bootstrap breakpoint. Rotated to 960px it moves to Tailwind md, so check both orientations.
For sharp full-width images, serve a source at least 1082px wide (412 CSS px × 2.625 DPR) through srcset and let the browser pick it.
/* Samsung Galaxy Z Fold 7 (folded): 412×960 CSS px, DPR 2.625 */
@media (max-width: 412px) {
/* styles for this width and narrower */
}
@media (min-resolution: 2.625dppx) {
/* serve high-density assets */
}The Samsung Galaxy Z Fold 7 (folded) reports a CSS viewport of 412×960 pixels in portrait and 960×412 in landscape. This value is derived from the physical resolution divided by the default device pixel ratio. Browser toolbars reduce the visible height slightly, so window.innerHeight is usually smaller than the full screen height.
The Samsung Galaxy Z Fold 7 (folded) uses a default device pixel ratio of 2.625. Each CSS pixel maps to 2.625×2.625 physical pixels on its 1080×2520 panel (cover display).
At 412px wide it matches no Tailwind breakpoint and no Bootstrap breakpoint, so only your base (mobile-first) styles apply. Rotated to 960px it matches Tailwind md (min-width 768px).
Open screensize.io, enter your URL and pick Samsung Galaxy Z Fold 7 (folded) (412×960). It opens your site in a real browser window at exactly that CSS viewport, so media queries, container queries and JavaScript resize logic behave as they would on the device. For touch behaviour and the real browser engine, confirm on hardware before shipping.
See the full list of device viewport sizes →
Or browse common screen sizes by category →
Use screensize.io to preview your website at any of these resolutions instantly — no DevTools needed.
Open screensize.io →