Logga

Relative dimensions

The em, rem, and percent dimension units are relative, that is, they adapt to the magnification/reduction (zoom) of a web page. Relative dimensions are preferable as they provide increased accessibility for, for example, the visually impaired.

For margins and distances, em should be used, instead of percent, because em provides the correct relationships between different parts of the web page.

BODY

BODY is the basis for all other fonts on the website. BODY is default when creating new websites and is set to 1 em by default (equivalent to 16 px).

New websites

When creating a new website, BODY is set to relative dimensions (preset to 1em). The other four fonts, which are included, are set to percent with BODY as the starting point. For other fonts that are created (heading, character, and paragraph style sheets), percent is set as the dimension unit.

E.g.:

Use the following formula to convert pixels to relative dimensions (em).

dimension in pixels/16 (constant)/BODY = em

Dimension in pixels: 11 px
BODY: 0.7 em

11/16/0.7 ≈ 0.98em

11 pixels correspond to 0.98 em

No space between 0.75 em. Use point, not comma.

The page published: 2020-03-23

Find us!

SiteVision AB (Headquarter)
Vasagatan 10
702 10 Orebro
Sweden


Info: +46 19-17 30 30
Support: +46 19-17 30 39