Question

When reading this question, i was wondering why anybody uses ex as a measurement for the width of an element. I understand that ex represents the height of a lowercase x, so i can use it to define the height of a input-box – for example.

But why would anybody use ex for the width of this box? Isn’t that possibly wrong depending on the type? And why shouldn’t I just use em in this case?

Answer 1

The height and width of elements are usually best specified considering both at the same time, to achieve “pleasing” ratios (e.g. 16:9, or the golden ratio). So just because ex is specified in terms of a height, it doesn’t make it less useful for specifying a particular width.

And you shouldn’t use em instead, since it’s the width of the upper case M. It’s highly unlikely that the two measurements are the same.

---

As a corollary, you’ll find plenty of example layouts that specify heights in terms on ems, which is again because they’re considering the ratios between heights and widths.