The em unit is interesting as you define font sizes of HTML elements relative to one another. To design a pleasing and easy to read webpage, you need consistent visual depth. For example, you want your <h1> to be twice as big as your body text, your <h2> only 1.5 times as big, and your sidebar slightly smaller. This could easily be achieved in CSS:

The span rely upon the p font-size value while the strong rely upon the html font-size value.

Which unit to use?

I’d recommend pixels to start with: as they’re absolute values, they aren’t affected by the element’s context. They are straightforward, allow to set the text size, image dimensions, border width, position coordinates…

Percentage and em values can be used alongside pixels, for relative text sizes especially.