Reviewed November 4, 2026

Your Size Chart Modal Is Broken on Mobile: Checks That Find It

Test the size chart on a real phone at the product page's busiest state: open it from the size selector, scroll the table sideways and down, close it with the button and with the back gesture, and confirm focus returns to the size link. Most failures are a fixed height container clipping the table, a close control outside the visible area, or a modal script that never fires on mobile templates.

The size chart is the highest intent link on an apparel product page. A shopper who opens it is measuring herself against your garment. When the modal opens half off screen, or will not close, or shows a table she cannot scroll, the visit rarely recovers. She does not file a bug report. She buys the size she knows at a store whose chart worked.

Desktop testing misses nearly all of this, because the failure set is mobile specific: viewport height, touch scrolling inside a fixed container, and theme code that loads a different template or defers the script that binds the link.

The checks, in order

Start at 360 pixels wide, the size that represents a large share of real phones. Open the chart and look for the close control without scrolling. If closing requires hunting, that is failure one. Swipe the table horizontally; size tables are wide, and a modal that clips the last columns without a scroll cue is failure two.

Then close the modal and watch where you land. Focus and scroll position should return to the size area of the product page. Landing at the page top means the modal hijacked the scroll state. Finally, add the item to cart straight after closing, because a modal that leaves an invisible overlay behind will block the next tap and look exactly like a dead buy button.

The usual causes

Fixed pixel heights on the modal container are the classic cause of clipping, especially with dynamic mobile browser chrome shrinking the visible viewport. Height in viewport units with a maximum, plus overflow scrolling on the table wrapper, resolves most of it.

Script timing is the other regular. If the chart link works on desktop and does nothing on mobile, check whether the mobile template loads the same bundle and whether the click handler waits on an event that touch interaction does not produce the same way. Them app embeds that inject their own size chart can also double bind the link and cancel themselves out.

Charts are content, not just plumbing

While the modal is open, read it. A chart that lists sizes without garment measurements, or measurements without saying whether they are body or garment numbers, fails the shopper even when the code is perfect. State the unit, inches or centimeters, with a toggle if you sell across borders.

Keep the chart reachable from the cart drawer and the size selector error state too, not only from a small link near the title. The moment of doubt repeats at checkout, and a chart that can be reopened there saves the sale the product page already won.

Frequently asked questions

Why does my size chart open on desktop but not on mobile?

Usually a template or script difference. Mobile may load a different section or defer the script that binds the link, or an app embed double binds the click. Test the live mobile page's console and compare the loaded assets against desktop.

How do I stop a size table clipping inside the modal?

Give the modal a maximum height based on the viewport and set the table wrapper to scroll in both directions with visible cues. Avoid fixed pixel heights, which break as mobile browser chrome resizes the visible area.

Should focus return to the size link after closing the chart?

Yes. Closing the modal should return focus and scroll position to the control that opened it. Dropping the shopper at the top of the page loses their place and reads as a site error.

What measurements should a size chart include?

At minimum the garment or body measurements the sizes are based on, labeled as one or the other, with units stated. For apparel that usually means chest, waist, and length, plus a note on how the garment is meant to fit.