How I Lost MadCSS – Frontend Masters Blog

This title could be clearer and more informative.Try out Clickbait Shieldfor free (5 uses left this month).

Chris Coyier recounts losing a CSS coding battle (MadCSS) due to a cascade of self-inflicted mistakes: unnecessary forced widths using 100vw, a bungled grid setup with incorrect repeat() and percentage row values, using overflow:clip instead of overflow:hidden, and insufficient horizontal space for a long unbreakable name combined with extra padding. Each mistake compounded the others, causing a grid blowout. The post walks through each error and the correct approaches, serving as a candid post-mortem on common CSS layout pitfalls.

5m read timeFrom frontendmasters.com
Post cover image
Table of contents
I Started Forcing WidthsI Even Bungled The Grid SetupThe Wrong OverflowText Size OverflowThe End
2 Comments

Sort: