skills.rest
Luqman-Ud-Din
Luqman-Ud-DinCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

qa-detect-reflow

Detect 320px reflow violations causing horizontal scrolling on mobile pages.

Updated May 22, 2026
Search Tags:#accessibility#mobile#wcag#responsive#overflow#reflow
One-click install
npx skills add https://github.com/Luqman-Ud-Din/blackbox-qa-agent --skill qa-detect-reflow
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: qa-detect-reflow
Source: https://github.com/Luqman-Ud-Din/blackbox-qa-agent/tree/main/skills/qa-detect-reflow
Command: npx skills add https://github.com/Luqman-Ud-Din/blackbox-qa-agent --skill qa-detect-reflow

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill finds reflow failures that make pages unusable on small mobile viewports, especially content that forces horizontal scrolling at 320px wide.

Core Features & Use Cases

  • 320px reflow checking: Detects page-level horizontal overflow against the WCAG 1.4.10 threshold.
  • Responsive content validation: Flags tables, images, and fixed-width blocks that cannot shrink to fit mobile screens.
  • Use case: Run it on a mobile page before release to catch layout defects that would otherwise slip through visual testing.

Quick Start

Use the qa-detect-reflow skill to scan the current mobile page for 320px reflow violations and report any horizontal overflow, oversized tables, images, or fixed-width elements.

Frequently Asked Questions about qa-detect-reflow

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check my web page for 320px reflow violations?▼

Checking 320px reflow violations involves scanning the mobile page to detect horizontal overflow, oversized tables, images, or fixed-width blocks that fail to shrink to fit the viewport.

What is WCAG 1.4.10 reflow and how does it affect mobile layouts?▼

WCAG 1.4.10 reflow requires content to fit within a 320px wide viewport without requiring horizontal scrolling. It affects mobile layouts by necessitating responsive design for tables, images, and fixed-width blocks to prevent overflow.

How do I detect fixed-width elements causing horizontal scrolling on mobile?▼

Detect fixed-width elements causing horizontal scrolling by performing in-page geometry inspection against the 320px threshold. This validates sizing and visibility to flag content that cannot shrink to fit mobile screens.

Can I validate responsive table layouts for small viewports automatically?▼

You can validate responsive table layouts for small viewports by running a mobile page scan that flags oversized tables and fixed-width blocks failing the 320px width threshold check during layout validation.

What types of content typically fail the 320px reflow threshold?▼

Content that typically fails the 320px reflow threshold includes oversized tables, large images, and fixed-width blocks that lack responsive sizing, causing page-level horizontal overflow on mobile screens.

Related Skills

Explore More Software Engineering Skills→
Luqman-Ud-DinLuqman-Ud-Din

qa-detect-ux-whitespace

Detect wasted horizontal space in responsive web layouts via DOM geometry inspection.

Community
Advanced
Luqman-Ud-DinLuqman-Ud-Din

qa-detect-breakpoint-edge

Detect responsive layout bugs at CSS breakpoint boundaries by comparing snapshots.

Community
Advanced
lord-vinayaklord-vinayak

accessibility-audit

Audit design files and UI descriptions for WCAG 2.2 AAA, Section 508, and ARIA APG compliance.

Community
Advanced
Luqman-Ud-DinLuqman-Ud-Din

qa-detect-viewport-meta

Detect missing or misconfigured viewport meta tags in web pages.

Community
Basic