Benefits of 'Em'

• The "em" is a unit of measurement in typography originally derived from the width of a capital M in a font at a particular point size. If Arial set in 10 points equals one em, then two em equals 20 points. In cascading style sheets, the em is used as a scalable unit where one em equals your standard font size. This allows the design to maintain hierarchy even when viewed on a mobile phone or large screen. It also allows users with visual impairments who have set their default font size larger to see the page with all the fonts in the correct relative size. The World Wide Web Consortium (W3C) recommends using ems as a best practice due to their scalability.
  
  

Benefits of 'Px'

• "Px" is a unit that is fixed in size. One pixel (px) is equal to one pixel on your screen. The standard 12-point font is equal to about 16 px. This unit doesn't scale for smaller mobile devices or for vision-impaired users, but it does have many aesthetic benefits. It gives the designer complete control over the font size in the design, which ensures that the type will not get out of proportion with the other design elements on the page. If you have type in an image, using px is essential for ensuring that the font hierarchy in your design is maintained, regardless of the device your site is viewed on or the user's browser settings.
  
  

Other Units

• There are two other options for setting fonts in CSS: point and percent. Points, like pixels, do not scale. Generally 12 point equals 100 percent. Points are based on the printed font size, not the size of the pixel on the screen. As a result, the measurements are not equal.
  
  Percent, like ems, will scale, but it will not scale in the same manner as ems. The difference in the size calculation between 200 percent and two ems depends on the browser. However, if you miscalculate with either ems or percentages, the user can change the text to be a better size.
  
  

Consider Audience and Purpose

• If you are designing a site for an old or young audience who might have legibility issues, it's important to use a scalable unit like ems. Using ems is also key if your site will be viewed on mobile devices. However, if graphic designers are your audience or the purpose of the site is more about the visual aesthetic than about the content, use a fixed unit like px to make sure that font hierarchy is preserved in any situation.