CSS includes several height and width properties to help you specify the
dimensions of your HTML elements. There are six different CSS properties that
can used to specify the height and width of an element. They are as follows:
height, width, min-height, max-height, min-width and max-width. In addition, you
can assign the auto and inherit value as well. You can assign each property
either a fixed measurement (px,pt,em,etc.) or a percentage value. For example,
if you specify a percentage value for the width property, the width of the
element you are styling will be set to a percentage of the parent element's
width.
Property | Description | Values |
height | Height of an element | auto, measurement, percentage, inherit |
width | Width of an element | auto, measurement, percentage, inherit |
min-height | Minimum height of an element | measurement, percentage, inherit |
min-width | Minimum width of an element | measurement, percentage, inherit |
max-height | Maximum height of an element | measurement, percentage, inherit |
max-width | Maximum width of an element | measurement, percentage, inherit |
Example
The following is an example of a <div> element with a width of 50%. Keep in mind that this div is within
another element on the page so the div element's width is not 50% of the screen, but will be 50% of the width of its
parent element
This div's width is set to 50%.
Did you find the page informational and useful? Share it using one of your favorite social sites.
Recommended Books & Training Resources