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