[multi-device-docs] Documentation device compatibility requires attention

Open Beginner friendly
#20,705 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
66/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Active
Tech stack
github-actions, javascript

Research direction

Reproduce the 4px horizontal overflow on /gh-cao/ in Chrome at 360px, using the Galaxy S21 viewport in the report. Inspect the page for subpixel, pseudo-element, or negative-margin overflow; the issue suggests bisecting with overflow-x: clip. Adjust the responsible width or margin so the page no longer scrolls horizontally at that viewport.

Written by the indexing model from the issue text.

Description

Test Summary
  • Triggered by: @pelikhan
  • Workflow run: §43280242055
  • Devices tested: 10
  • Browser engines tested: 2 (Chrome, WebKit; WebKit is a Safari compatibility signal, not physical iOS)
  • Color schemes tested: 2
  • Test date: 2026-11-12
Results Overview
  • Passed: 39 of 40 combinations
  • Warnings: 1
  • Critical: 0
Critical Issues

None.

Accessibility Findings

No unnamed controls, one main and one h1 on every combination; the requested color scheme was confirmed via matchMedia.

Warnings
  • Horizontal document overflow (4px) on Chrome, Galaxy S21 (360x800), light and dark: scrollWidth - innerWidth = 4 on /gh-cao/. No single element was found with a right edge past the viewport, so the source is likely a subpixel or pseudo-element/negative-margin overflow. WebKit at 360px shows no overflow.
  • Not counted as docs defects (sandbox/infrastructure): external github.com/user-attachments images failed to load with ERR_CERT_AUTHORITY_INVALID in the firewall, so they appear as broken images on larger viewports.
  • Only the home page was tested in this run (not a full navigation/interaction sweep).
Compatibility Matrix

Chrome and WebKit, light and dark, all of iPhone 12, iPhone 12 Pro Max, Pixel 5, iPad, iPad Pro 11, iPad Pro 12.9, HD, FHD and 4K: no overflow, title present, one main region. Chrome Galaxy S21: 4px overflow (above). Screenshots were captured under /tmp/gh-aw/agent/multi-device-docs/screenshots/ but could not be uploaded because no upload tool was available.

Recommendations

Find the element causing the 4px overflow at 360px in Chrome (for example, with overflow-x: clip bisecting) and fix its width/margin so the page does not scroll horizontally on narrow phones.

Generated by 📝 Multi-Device Docs Tester · copilot · auto (Claude Sonnet 5.5) · ~24 AIC · ⌖ ~2 AIC · ⊞ 12.2K · ◷

  • expires on Nov 15, 2026, 6:40 PM UTC
Dominant language
JavaScript
Stars
19
Forks
4
Avg merge
4h
Merged PRs (30d)
708

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from githubnext/gh-cao

All issues in githubnext/gh-cao

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.