Absolute Units in CSS

Below are some of the most commonly used absolute units in CSS, including syntax and examples:

Pixels (px)

Definition: Pixels are the most commonly used absolute unit in CSS. They represent a single dot on the screen.

Use Case: Setting the size of fonts, images, and elements where you need precise control over dimensions.

Example:

div {
    width: 300px;
    height: 200px;
    font-size: 16px;
    margin: 10px;
} 

Points (pt)

Definition: Points are mainly used in print media. 1 point is equal to 1/72 of an inch.

Use Case: Frequently used in print layouts to define font size or element spacing when designing for print.

Example:

body {
    font-size: 12pt;
}

Inches (in)

Definition: Inches are a unit of length that corresponds to 2.54 centimeters.

Use Case: Often used in print media when you want to define dimensions based on physical measurements.

Example:

div {
    width: 5in;
    height: 3in;
}

Centimeters (cm)

Definition: Centimeters are another physical unit of measurement. 1 inch equals 2.54 cm.

Use Case: Useful for print or physical document layout where exact physical dimensions are required.

Example:

div {
    width: 10cm;
    height: 7cm;
}

Millimeters (mm)

Definition: Millimeters are a smaller unit of length, where 1 cm equals 10 mm.

Use Case: Used for precision in print media or physical layouts when you need very fine measurements.

Example:

div {
    width: 50mm;
    height: 30mm;
}