From 2802ccf8c1212e5ef49226e7063fbf008ea4c13e Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 27 Feb 2026 15:38:08 +0000 Subject: Fix mobile horizontal scrolling caused by wide RSS content RSS feeds can contain tables, iframes, and other elements with explicit widths that overflow the viewport on mobile. Added overflow-x: hidden to .item-description and .main-content, and extended max-width: 100% to cover table and iframe elements inside item descriptions. Includes TDD tests verifying the CSS containment rules. https://claude.ai/code/session_0141nhxmYfoFPVPZ813K1XFD --- frontend-vanilla/src/style.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'frontend-vanilla/src/style.css') diff --git a/frontend-vanilla/src/style.css b/frontend-vanilla/src/style.css index 27a8d28..4d69390 100644 --- a/frontend-vanilla/src/style.css +++ b/frontend-vanilla/src/style.css @@ -288,6 +288,7 @@ html { width: 100%; height: 100%; min-width: 0; + overflow-x: hidden; overflow-y: auto; background-color: var(--bg-color); padding: 1.5rem 2rem; @@ -517,6 +518,7 @@ select:focus { margin-top: 1rem; overflow-wrap: break-word; word-break: break-word; + overflow-x: hidden; } .item-description a { @@ -526,7 +528,9 @@ select:focus { .item-description img, .item-description video, -.item-description pre { +.item-description pre, +.item-description table, +.item-description iframe { max-width: 100%; height: auto; display: block; -- cgit v1.2.3