Responsive design test

Check that your layout fits every screen, from small phones to wide desktops. The test resizes your page through 11 common widths and measures whether content spills past the right edge, which forces visitors to scroll sideways. When it does, the report names the elements that stick out and where.

Runs only this test. Want everything? Run all 18 tests from the home page.

What this test checks

Phones

Widths of 320, 360, 375, 390 and 414 px, where sideways scrolling hurts most.

Tablets and foldables

Widths of 672, 768, 834 and 1024 px.

Laptops and desktops

Widths of 1280 and 1440 px.

Horizontal overflow

How many pixels wider than the screen the page is at each width.

Offending elements

The outermost elements that extend past the right edge, with their CSS selector and where their right edge ends.

Sample result

A real result for devteam.co.kr, tested 17 hours ago.

Responsive layout

The layout fits all 11 tested screen widths.

100/100A+
Phones (320–414px) (Good)
Content fits the screen at every tested width (414px, 390px, 375px, 360px, 320px).
Fits at 5 widths
Target: No horizontal scrolling
Tablets and foldables (672–1024px) (Good)
Content fits the screen at every tested width (1024px, 834px, 768px, 672px).
Fits at 4 widths
Target: No horizontal scrolling
Laptops and desktops (1280–1440px) (Good)
Content fits the screen at every tested width (1440px, 1280px).
Fits at 2 widths
Target: No horizontal scrolling

Screen widths tested

1440px 1280px 1024px 834px 768px 672px 414px 390px 375px 360px 320px

How it works

  1. The test runs in headless Chromium on our test server in Virginia, USA, in the same browser session as the accessibility check.
  2. After the page loads at 1366×860, the window is resized from 1440 px down to 320 px, and the layout is measured once it settles at each width.
  3. Overflow is the page's scroll width minus the window width, and anything over 1 px counts; fixed-position and hidden elements are ignored when finding the cause.
  4. Every request goes through a network guard that only connects to public IP addresses on ports 80 and 443.

How it is scored

The score uses our item-weighted formula: each screen group earns full credit when it fits, half when the worst overflow is 8 px or less and none above that, with phones weighted 3× and tablets and desktops 2× each. Grades follow our scale: A+ 95+, A 90+, B 80+, C 70+, D 60+, F below 60.

CheckGoodNeeds workPoor
Phones (320–414 px)No overflowUp to 8 pxMore than 8 px
Tablets and foldables (672–1024 px)No overflowUp to 8 pxMore than 8 px
Laptops and desktops (1280–1440 px)No overflowUp to 8 pxMore than 8 px

Grades: A+ 95–100 · A 90–94 · B 80–89 · C 70–79 · D 60–69 · F below 60.

FAQ

How do I test if my website is responsive?
Enter your URL and run this test. It resizes your page through 11 widths from 320 px to 1440 px and reports every width where content is wider than the screen, with the elements that cause it.
What causes horizontal scrolling on mobile?
Common causes are images, tables, iframes and code blocks wider than the screen, fixed pixel widths on containers, and flex rows that do not wrap. Giving media and tables max-width: 100%, letting flex rows wrap and avoiding fixed widths usually fixes it.
Which screen widths should I test?
This test uses 320, 360, 375, 390 and 414 px for phones, 672, 768, 834 and 1024 px for tablets and foldables, and 1280 and 1440 px for laptops and desktops. The narrowest, 320 px, is also the width at which WCAG's Reflow criterion (1.4.10) expects content to fit without horizontal scrolling.
Is a few pixels of overflow a problem?
Even a small overflow lets the page shift sideways when visitors swipe, which feels broken on a phone. This test treats up to 8 px as needing work and more than 8 px as a fail.