<?xml version="1.0" encoding="utf-8"?>

CSS x-height (ex)

CSS x-height (ex) Bad Practice
CSS x-height (ex) Best Practice

Ex is a relative length unit that refers to the x-he­ight of a given font — the height of a lowercase x. As you can probably guess, it's another length unit that came to CSS from typography.[1] Although rarely used, ex is helpful in the area of micro­ty­po­graphy — for example, to determine the posi­tion of super­script and subscript charac­ters. The x-he­ight can be a refe­rence point for control­ling the size of icons or bullets used in the text or to size inline images to fit the x-height of the current font for visual harmony.

Improve your UX & Product skills with interactive courses that actually work