Rules Hub
Code Ruleset
← Back to all rules
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
frontend ruleP2stack specificStack: css
csslayoutresponsiverobustness
Don't fix element height in a way that clips content
Avoid hard `height` on content containers that can overflow; achieve a minimum size with `min-h-*` or vertical padding so longer content can grow instead of being clipped.
PR: hegnar-bellsheep-web · org-mining-2026-06Created: Jun 17, 2026
Bad example
Old codehtml
| 1 | <button class="h-8">...</button> <!-- content taller than 8 overflows --> |
Explanation (EN)
A hard height can clip valid longer content or enlarged text.
Objašnjenje (HR)
Good example
New codehtml
| 1 | <button class="min-h-8 py-1.5">...</button> |
Explanation (EN)
Objašnjenje (HR)
Notes (EN)
For variable text/content containers, test long copy, localization and zoom and use a minimum size plus padding when the design permits growth.
Exceptions / Tradeoffs (EN)
Fixed-height viewports can be intentional with an accessible overflow strategy. Verify flex shrink/min-size and text wrapping rather than assuming min-height alone resolves every clipping case.