11651 shaares
404 private links
404 private links
Some things to consider in this reset:
- an anonymous layer is used.
- border-box for all
- reset margins and borders
- reset body margins and paddings.
- min body height is 100%
- typography: line-height 1.5; prevent
text-size-adjustfor mobile - but headings, button, input and label get a smaller line-height
- prevent media content overflow with
max-inline-size: 100%; display: block; block-size: auto - fill svg with currentColor for svg without fill properties
- inherit fonts in fields
- textarea should resize only vertically
- remove fieldset borders
- text with
text-wrap: pretty - every digit has its own size (use tabular-nums for tables, time, math) with
font-variant-numeric: proportional-nums overflow-wrap: break-wordon texts and heading to avoid inline overflows- get the numbers on the same baseline with
font-variant-numeric: lining-nums; - hanging punctuation must be set properly
- code clarity is a must, so
font-variant-numeric: slashed-zerois useful. - collapse table borders
- reset
supandsubline-height because they are messing with it in texts - align opacity with
:disabledto 0.8 for all browsers and set the cursor: not-allowed - add an outline-offset to 0.2rem for
:focus-visible