skills.rest
guneysol
guneysolCOMMUNITY
Explore all skills by this author →
𝕏@guneysolGitHub

mobile-check

Audits web pages at phone and tablet viewports for responsive layout problems.

Updated Jul 17, 2026
Search Tags:#frontend#responsive design#css#mobile testing#browser testing#viewport#layout audit
One-click install
npx skills add https://github.com/guneysol/agent-configs --skill mobile-check-guneysol
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-check
Source: https://github.com/guneysol/agent-configs/tree/main/agents/skills/mobile-check
Command: npx skills add https://github.com/guneysol/agent-configs --skill mobile-check-guneysol

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Responsive layout bugs like horizontal overflow, clipped content, and broken navigation often go unnoticed when developers only test on desktop. This Skill systematically audits a web page across representative phone and tablet viewports and traces confirmed issues back to source files. ## Core Features & Use Cases - Multi-Viewport Inspection: Checks a desktop baseline at 1440×900 plus 375×667, 393×852, and 768×1024 viewports. - Targeted Issue Detection: Examines horizontal overflow, clipping, overlaps, navigation collapse, touch targets, tables, media sizing, and sticky overlays at each viewport. - Source-Level Reporting: Traces confirmed issues to source files and reports them by viewport, with optional fixes and re-verification. - Use Case: Before shipping a landing page, ask for a mobile check to confirm the navigation collapses correctly and no content overflows on a 375px-wide phone screen. ## Quick Start Run a mobile responsive check on the current page and report any layout issues by viewport.

Frequently Asked Questions about mobile-check

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

FAQPage Schema
How do I test a web page for mobile responsive issues?▼

Inspect the page at a desktop baseline around 1440×900, then check phone viewports at 375×667 and 393×852 and a tablet viewport at 768×1024. At each size, look for horizontal overflow, clipping, overlaps, and navigation collapse.

What viewport sizes should I use for responsive testing?▼

Use 375×667 and 393×852 to represent common phone screens and 768×1024 for tablets, alongside a desktop baseline near 1440×900. These cover the most representative breakpoints for responsive layout verification.

What layout problems does a mobile viewport audit check for?▼

The audit checks horizontal overflow, content clipping, element overlaps, navigation collapse behavior, touch target sizing, table and chart rendering, media sizing, and fixed or sticky overlays at each viewport.

Does mobile testing require a running local server?▼

A stopped localhost server does not mean browser testing is unavailable. The workflow attempts the repository's normal startup command after completing any worktree env setup, and reports the concrete failure only if startup does not work.

Will the audit automatically fix responsive layout bugs?▼

No, it asks before editing unless fixes were already requested. When fixes are applied, it prefers existing responsive utilities and design-system primitives, keeps changes narrow, and rechecks the failing viewports afterward.

Related Skills

Explore More Software Engineering Skills→
JetBrainsJetBrains
302

webapp-testing

Automates UI checks and captures screenshots for locally hosted web apps.

Official
Intermediate
ReshzyReshzy

tailwindcss-development

Fix Tailwind utility classes in Blade, JSX, or Vue templates for responsive layouts and dark mode support.

Community
Intermediate
bdbchbdbch
2

accessibility-review

Audit web applications for WCAG 2.1/2.2 accessibility compliance in Chrome.

Community
Advanced
MolcajeteAIMolcajeteAI
2

visual-regression

Automate visual regression testing with Playwright and Percy across browsers and viewports.

Official
Intermediate