Responsive design - units of measure
- Fixed: px, pt, pc, in, mm, cm
- Proportional: % – percent of container size
- em – current font size based on context
- html { font-size: 16px }
- 1em = 16 px
- However - header { font-size: 36px } header h1 { font-size: 1em } would make the header h1 = 36px
- rem – Root em, font size of html tag
- html { font-size: 16px }
- 1rem = 16 px
- However - header { font-size: 36px } header h1 { font-size: 1em } would make the header h1 = 16px
- vw – 1% of viewport width
- vh – 1% of viewport height