CSS Lab · LAB-02Under investigation
“Tailwind means you don't need CSS knowledge.”
Utility classes change how you write declarations. They do not change the box model, the cascade, stacking contexts or formatting contexts, and those are the parts that confuse people.
- Verdict
- BUSTED
- Level
- CURIOUS
- Division
- LAB-02
- References
- 02
Investigation
flex items-center gap-4 is display: flex; align-items: center; gap: 1rem. When the layout misbehaves, the debugging is identical: which formatting context, which containing block, which intrinsic size. A utility framework removes the naming problem and the dead-code problem. It does not remove the layout model.
The tell is z-50 failing to put a dropdown above a header. No utility framework can fix that, because the cause is an ancestor stacking context, a concept that exists one layer below whatever syntax you are writing.