---
title: "Unit Measurements in HTML Using CSS3"  
description: "In this article I have tried to explain the unit measurements in HTML."  
author: "Vijay Shukla"  
published: 2012-12-29  
updated: 2017-11-29  
canonical: https://www.mindstick.com/articles/1099/unit-measurements-in-html-using-css3  
category: "css-css3"  
tags: ["css-css3"]  
reading_time: 2 minutes  

---

# Unit Measurements in HTML Using CSS3

In this [article](https://yourviews.mindstick.com/view/81489/kashmir-now-after-an-year-of-abrogation-of-article-370) I have tried to [explain](https://www.mindstick.com/forum/159699/what-is-a-compilation-error-in-dot-net-core-explain-with-an-example) the unit measurements in HTML.\

##### Percentage (%):

A percentage value is produced by an [optional](https://www.mindstick.com/interview/22851/main-difference-between-optional-and-required-keywords) + or -, followed by a number, followed by %. There are no spaces in a percentage value. Percentage [values](https://www.mindstick.com/forum/159360/how-to-write-sql-query-to-join-comma-separated-values) are [relative](https://answers.mindstick.com/qa/105067/how-to-trade-with-the-relative-vigor-index) to other values, as defined for each property. Most often the percentage value is relative to the element's [font size](https://www.mindstick.com/forum/158654/what-is-the-css-property-used-to-specify-the-font-size-of-an-element).

##### Example:

```
p {font-size: 16pt; line-height: 125%;}
```

##### cm:

[Define](https://yourviews.mindstick.com/audio/1110/lifestyles-choices-that-define-our-lives) the measurement in centimeters.

##### Example:

```
div {margin-bottom: 2cm;}
```

##### em:

It’s the unit of measurement, its relative measurement for the height of a font in em spaces. Because an em unit is equivalent to the size of a given font, each "em" unit would be 12pt; thus, 2em would be 24pt.

Example:

```
p {letter-spacing: 6em;}/*means 12*6=72pt*/
```

##### px:

[Identify](https://www.mindstick.com/forum/159425/java-app-crash-arrayindexoutofboundsexception-identify-invalid-index) a measurement in screen pixels. Pixels (a dot on the [computer screen](https://answers.mindstick.com/qa/108521/what-to-do-if-your-computer-screen-is-flickering))

##### Example:

```
p {padding: 20px;}
```

##### pc:

Identify a measurement in pica. 1 pc is the same as 12 points; thus, there are 6 picas per inch.

##### Example:

```
p {font-size: 25pc;}
```

##### ex:

Identify a measurement relative to a font's x-height. The x-height is resolute by the height of the font's lowercase letter x. one ex is the x-height of a font (x-height is usually about half the font-size).

##### Example:

```
p {font-size: 24pt; line-height: 2ex;}
```

##### mm:

Identify a measurement in millimeters.

##### Example:

```
 p {word-spacing: 17mm;}
```

##### in:

Identify a measurement in inches.

##### Example:

```
p {word-spacing: .18in;}
```

##### pt :

Identify a measurement in points. 1 pt is the same as 1/72 inch.

##### Example:

```
body {font-size: 20pt;}
```

---

Original Source: https://www.mindstick.com/articles/1099/unit-measurements-in-html-using-css3

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.