Design Prototyping in the Browser Page Layout Defining Content Areas

Harsha Vardhan Sannareddy
Harsha Vardhan Sannareddy
5,734 Points
Posted by Harsha Vardhan Sannareddy
Harsha Vardhan Sannareddy
5,734 Points

What is the rem measurements. most of the times I have seen people using either px or %. Is there any specific reason

Is there any specific reason that you are using rem as measurement rather than px or percentage ?

2 Answers

Steven Parker
Steven Parker
153,098 Points
Steven Parker
Steven Parker
153,098 Points

The "em" and "rem" measurements are based on font sizes, where percentages ("%") are based on the window (or parent object) size. The choice would usually be based on whether you are sizing something for text or images.

A pixel ("px") measurement is for when you don't want the size to be responsive to either screen or font sizes. It will always take up the same space.

Susan Furest
Susan Furest
783 Points
Susan Furest
Susan Furest
783 Points

I would also note that usually there is an established rem size of 1 for standard paragraph text within a company's front end style guide. Say its 16px. You can change the css from 1rem to .875rem to get a font size of 14px. Designer's usually don't spec out front sizes in rem, but they can be coded that way!