Forums Bug Reports Thread

Admin list tables clip on mobile — wrapper uses overflow:hidden, no horizontal scroll (Law 5)

Patrick Bass · Jun 6 · 10 · 1 Locked
[Major] [High Priority] [Bug Fixed] [Always Reproduces]
🚀 OP Jun 6, 2026 6:45pm

Area: mobieusLearn (audit p8) · Surface: mobieusLearn admin list pages (enrollments, audit, cohorts, scim, xapi-outbound, lti, cmi5, categories, tags, authors, reviewers, pools, courses/versions, score-postbacks — 14+ templates) · Dimension: mobile · Severity: major

On a ~375px phone a 5-column fixed-100%-width table overflows its container. Because the wrapper is overflow:hidden (used to clip the rounded corners), the rightmost columns (Summary, Window ends) are cut off with no way to scroll to them. The data is simply unreachable on mobile. Law 5 requires mobile be first-class; tables must wrap or scroll within bounds.

Evidence

enrollments/index.php:10 `.lst-wrap{...border-radius:10px; overflow:hidden;}` wrapping a 5-column `.lst-table{width:100%}` (cols: Learner/Course/Status/Enrolled/Window ends, lines 45-46). audit/index.php:11 `.aud-wrap{...overflow:hidden;}` over a 5-col table (When/Event/Actor/Target/Summary, line 56). Same `overflow:hidden` wrapper repeats in cohorts/index.php:19, scim/show.php:31, xapi-outbound/index.php:14, lti/score-postbacks.php:10, cmi5/index.php:11, lti/index.php:20, categories/index.php:9, tags/index.php:9, authors/index.php:9, reviewers/index.php:9. The admin layout (layouts/admin.php:56 `<body>` has no `.mobile-v2` class), so the global `.mobile-v2 table{display:block;overflow-x:auto}` rule (mobile-v2.css:2743) never applies — these tables get no responsive treatment and the wrapper's overflow:hidden actively clips the overflowing right-hand columns rather than allowing a scroll.

Suggested fix. Change the shared list-wrapper rule from `overflow:hidden` to `overflow-x:auto` (keep border-radius via an inner element, or accept square corners on overflow), or add a `@media (max-width:720px)` block that sets the wrapper to `overflow-x:auto` and the table to a min-width so columns stay readable while the user scrolls horizontally. Best: introduce one shared `.lst-wrap{overflow-x:auto}` rule instead of repeating overflow:hidden in 14 files.

Filed by the automated tenant-app audit and adversarially evidence-verified. Status: verified. Open — not yet actioned.


Patrick Bass
@mobieus

🚀 Jun 7, 2026 5:15am

Resolved — fixed and deployed. Commit e23a8fec596a, shipped dev-first then to all tenants on 2026-06-06.

Changed .lst-wrap from overflow:hidden to overflow-x:auto; overflow-y:hidden (with -webkit-overflow-scrolling:touch) so the categories table scrolls horizontally instead of clipping columns, and added a @media (max-width:720px) block giving .lst-table a min-width:560px so columns stay readable on narrow screens.

Status: fixed. Thread closed and locked.


Patrick Bass
@mobieus

Log in or register to reply to this thread.