Grid and flex items default to min-width auto, so the nowrap command line set the minimum width of the whole hero-main copy column; on narrow viewports the column ran past the screen and the claim, command, and note were clipped. min-width: 0 at both links in the chain lets the column track the viewport and the command's own overflow-x: auto take over.
- commit
- 841b87c56c6ba28aa1264c065653517b2e11175c
- parent
- 49476aec743e175e38a7280dfebcba6dab20d915
- author
- Dami <dami.etoile@gmail.com>
| M | website/ | 7 | +++++++ |
@@ -269,6 +269,12 @@
269269 align-items: center;270270 padding-bottom: 1rem;271271 }272+/* Grid items default to min-width auto, so the nowrap install command273+ would set the column's minimum and push the whole copy column past274+ narrow viewports; let the columns shrink and the command scroll. */275+.landing .hero-main > * {276+ min-width: 0;277+}272278 @media (max-width: 860px) {273279 .landing .hero-top {274280 padding-top: 2.2rem;@@ -414,6 +420,7 @@
414420 overflow-x: auto;415421 white-space: nowrap;416422 flex: 1;423+ min-width: 0;417424 background: none;418425 border: 0;419426 }