Rules Hub
Coding Rules Library
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
Use margin-block / margin-inline instead of all-sides margin when spacing only one axis
Apply margin on the axis you mean with margin-block / margin-inline rather than the all-sides margin shorthand.
Bad example
| 1 | .paginationWrapper { |
| 2 | margin: rem-calc(16); |
| 3 | } |
Explanation (EN)
The all-sides shorthand sets horizontal margins too, which may be unintended for a full-width block. It also hides whether left/right spacing was actually wanted.
Objašnjenje (HR)
Skraceni zapis za sve strane postavlja i horizontalne margine, sto za blok pune sirine moze biti nenamjerno. Takoder skriva je li lijevi/desni razmak uopce bio zeljen.
Good example
| 1 | .paginationWrapper { |
| 2 | margin-block: rem-calc(16); |
| 3 | } |
Explanation (EN)
margin-block states the intent explicitly — vertical spacing only — and won't introduce horizontal margins you didn't ask for. Use margin-inline when you genuinely need both sides on the horizontal axis.
Objašnjenje (HR)
margin-block jasno izrazava namjeru — samo vertikalni razmak — i nece uvesti horizontalne margine koje nisi trazio. Koristi margin-inline kad stvarno trebas obje strane na horizontalnoj osi.
Exceptions / Tradeoffs (EN)
When you genuinely want spacing on all four sides, the plain `margin` shorthand is fine and clearer.
Iznimke / Tradeoffi (HR)
Kad stvarno zelis razmak na sve cetiri strane, obican `margin` skraceni zapis je u redu i jasniji.