Introduction
Supercharge your CSS
()
Exercise files
()
Using GitHub Codespaces with this course
()
1. Working With CSS
Should I normalize or reset my CSS?
()
Write better CSS with stylelint
()
2. Container Tips
The vw unit is a bit of a mixed blessing
()
Consistent sizing with box-sizing: border-box
()
Logical box properties instead of top, right, bottom, left
()
Writing modes
()
Horizontal and vertical alignment in any container
()
Maintain aspect ratio in containers and images
()
How the clear property works
()
Move over clearfix: Clearing with flow-root
()
3. Typography
px, em, and rem units explained
()
Set natural line lengths with the ch unit
()
Responsive sizing with min(), max(), and clamp()
()
Add a drop cap to your text
()
Truncate text length and number of lines of text
()
Style text selection and highlighting
()
Making sense of the line-height property
()
4. Custom Properties
Custom properties with default values
()
Nesting custom properties to create functions
()
Create light or dark mode with custom properties
()
Sidebar: hsla() colors are just better
()
5. Layout
Should you use grid, flex, or float?
()
Add gaps and gutters to grid and flex
()
Pseudo-elements are true grid and flex items
()
Putting things on top of one another using grid
()
Fixed and sticky elements
()