max-width using em

Question

Can someone please explain how the em unit of measurement works with the max-width css property? On my screen resolution of 1920 x 1080 I have found that setting the max-width to 140em is the equivalent of max-width of 100%.

Answer 1

Em is just another unit. It depends on the font size. Current font size (e.g. 14px) = 1em. 2em doubles the font size (28px).

Have a look at your screen resolution: 1920/140 = 13,714285714 - looks like your current font size is 14px. Therefore setting max-width:140em is the same like max-width:1920px or max-width:100% - in your special case.

Answer 2

This site, http://pxtoem.com, makes conversion and has a table of each size.