Length, Size Types and URL Values
In this lesson, we'll see the different ways to specify size and lengths of various HTML elements in CSS and how to achieve cross-platform size and length compatibility. In addition, we will touch upon URL values. Let's begin!
We'll cover the following...
When designing the layout of a page, you often need to specify sizes, such as the width or height of a box, top and bottom margins of paragraphs, and so on.
To indicate size, CSS offers a number of type size options including:
- pixels
- points
- picas
- inches
- centimeters
- millimeters
- em-heights
- ex heights
- percentages
When you define a style property that specifies a size or length value, you always need to specify the unit of measure as well.
The above point is shown in the example below:
p {margin-top: 4px;margin-right: 1in;margin-bottom: 0.5em;margin-left: 0;}
The only value that does not need a unit of measure is zero, for it is exactly the same independent of the unit used to calculate it.
The table below summarizes the size type options:
Size type options
Logical units ( ...