humanmade / humanmade/hm-pattern-library
Use relative units for font-size, line-height, margin, etc
- Dominant language
- HTML
- Stars
- 26
- Forks
- 8
- PR merge metrics
- No merged PRs in 30d
Description
An adjustment we had to make in H2 to use the pattern library was to switch the margins and line-heights to font-size-relative units (unitless values for line-height, and `em`s for margins/padding). This allows us to mark an entire section (say, a sidebar) as `font-size: 0.8rem` and have the sizes cascade properly while maintaining their relative proportions.
`rem` should really be used at the page-layout level, rather than on every element. Where possible, font-sizes should be relative to their parent, while other properties should be relative to the element.
See https://github.com/humanmade/red-book/pull/7#discussion_r182642731
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.