Obsessed with React and teaching. I help people become Frontend Developers. Living with my fiancee and Yorkshire Terrier 🐶 in Poland.
Obsessed with React and teaching. I help people become Frontend Developers. Living with my fiancee and Yorkshire Terrier 🐶 in Poland.
Image by patricia serna from Unsplash

CSS Relative Units

Jan 14, 2021

DESCRIPTION

Do you only use pixels or % in CSS? Open yourself to more possibilities and best practices with other available units.

Preview

Relative units

HTML
CSS

Summary

  • Each unit has its own use cases and best practices.
  • I love using rem as it's a scalable unit and consistent across devices (if proper media queries are set in root HTML element). Also, a lot of duplication is removed as e.g. font is changed in one place.
  • viewport units can be a good solution for full-page screens and other scenarios where you need to take viewport size into consideration.
  • Always Check supported browsers on caniuse for the unit you use.
logo with a rocket of the BigDevSoon application

Level up your Frontend skills

Code real-world projects based on Figma designs.
spread the word
Did you like this post? Share it with the world! 🌐