-
fix(css): stop news-feed grid items overflowing the mobile viewport (#3731)
发布于
2026-04-29 16:44:15 +00:00 The release-gate
mobile-safarijob has been failing on the News Feed
mobile UI audit (Mobile Safari, 390x664):Overflowing Elements (5): - div.ldr-news-feed: 14px overflow - div.ldr-feed-header-section: 14px overflow - div.ldr-filters-bar: 14px overflow - div.ldr-news-cards-container: 14px overflow - div.: 14px overflowRoot cause
The mobile rule for
.ldr-news-containercollapses to a single-column
CSS grid (grid-template-columns: 1fr), but grid items default to
min-width: autowhich evaluates to the child's intrinsic min-content
width..ldr-filter-btnand the news-meta tags inside the feed have
white-space: nowrap+min-width: fit-content, so a single long
filter pill is enough to widen its column past the 1fr allocation —
which then pushes the whole feed past the viewport. The exact 14px
matches the longest unbreakable filter content overflow on this layout.Fix
Set
min-width: 0on the grid item.ldr-news-feedand its three
overflow-flagged descendants so 1fr is actually obeyed, plus
max-width: 100%for belt-and-suspenders against any future child
declaring an explicit width.No template changes; CSS-only.
下载附件