Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

CSS Tips

via LinkedIn Learning

Go to class Write review

Overview

Learn how to address specific challenges and combinations in CSS, along with techniques you can apply in your web styling.

Syllabus

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

Conclusion

Thanks

Taught by

Morten Rand-Hendriksen

Reviews

4.9 rating at LinkedIn Learning based on 100 ratings

Start your review of CSS Tips