CodePrimer
Search a living directory of web syntax. Pick a problem, copy a working sample, then adapt it.
Three ways to apply CSS
What are inline, internal, and external CSS?
CSS box model
Why is my element wider than expected?
Margin vs padding
What is the difference between margin and padding?
display block inline flex
How does display change layout?
CSS position values
How do I pin an element or overlap layers?
CSS custom properties
How do I reuse colors with variables?
Hover and focus-visible
How do I style hover and keyboard focus?
Class vs ID selectors
Should I style with classes or IDs?
Link an external CSS file
How do I attach a stylesheet?
Flex row with gap
How do I put items in a horizontal row?
Flex wrap responsive chips
How do flex items wrap on small screens?
Responsive card grid
How do I make cards auto-fit columns?
Simple CSS transition
How do I animate hover smoothly?
Truncate long text with ellipsis
How do I cut overflow text with …?
Max-width page container
How do I keep content from stretching too wide?
Simple CSS reset start
How do I normalize browser defaults a bit?
Space-between header layout
How do I put logo left and links right?
Internal CSS with style tag
How do I put CSS inside the HTML file?