December 10, 2025
Center this drama, not your divs
Incomplete List of Mistakes in the Design of CSS
CSS gets roasted: tables, margins, and !important chaos
TLDR: A developer posted a playful “time machine” list of CSS design do-overs, from margin collapse to z-index confusion. Commenters erupted over user research vs committee choices, tables vs centering, and a spicy takedown of “!important,” spotlighting how the web’s styling quirks still shape everyday frustrations.
A cheeky “Incomplete List of Mistakes in CSS” dropped like a time machine wishlist, calling out confusing names, weird defaults, and the infamous margin-collapsing gremlin. Think: “white-space: no-wrap,” “z-index” should’ve been “depth,” and “box-sizing” should’ve started at the obvious setting. The vibe? A cathartic group therapy for anyone who’s ever tried to center things and lost hours of their life.
The comments set the stage on fire. edent demanded user research over design-by-cabal: “what user research have you done on this?” Meanwhile anonymars unleashed a classic: the web banned tables, then spent years figuring out how to center stuff—and we’re still not sure we did. Accessibility came swinging too; nfw2 wants heading spacing fixed so titles sit closer to their content, not floating awkwardly. groby_b took a flamethrower to !important, joking there are only three numbers—zero, one, infinity—and “one” was the mistake. Kuharich linked a sequel thread for the lore nerds (past comments). The memes flew: “Center‑gate,” “Margin Collapse Monster,” and renaming CSS to “Can’t Style Simply.” Some defend messy history; others say the web could’ve been simpler if anyone had asked users first. Drama, nostalgia, and pure styling chaos—served hot.
Key Points
- •The article lists proposed corrections to CSS property names, defaults, and behaviors to improve consistency and predictability.
- •It recommends box-sizing: border-box as the default, clearer axis ordering for two-axis properties, and logical margin shorthand ordering.
- •It argues against automatic margin collapsing within a single box and calls for more intuitive stacking/z-order behavior across all elements.
- •Color handling should be simplified: retain dashed multi-word color keywords, standardize naming, and use optional alpha in rgb()/hsl() instead of separate rgba()/hsla().
- •It proposes aligning syntax and tokenization (e.g., unicode-range), consolidating text wrapping into white-space, and simplifying flexbox size interactions.