CSS Tips

Go to class
Write Review

Free Online Course: CSS Tips provided by LinkedIn Learning is a comprehensive online course, which lasts for 1-2 hours worth of material. The course is taught in English and is free of charge. Upon completion of the course, you can receive an e-certificate from LinkedIn Learning. CSS Tips is taught by Morten Rand-Hendriksen.

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
    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