CSS Height and Width

      No Comments on CSS Height and Width

CSS Height and Width are used to set height and width of any element.
height is used to specify height for a particular element.

width is used to specify width of a particular element on the web page.

Values possible are:

  • auto :browser specifies the width and height. (default)
  • specified in length values, like px, cm, etc.
  • percent (%) of the containing block.

CSS Height and Width


Example 1:

div {
    height: 200px;
    width: 50%;
    background-color: pink;
Hi i am a division

Example 1:

div {
    height: 300px;
    width: 100px;
My width is 100px

Note:Note: The height and width properties do not include padding, borders, or margins; they set the height/width of the area inside the padding, border, and margin of the element!

CSS Height and Width:max-height and max-width Properties

The max-width property is used to set the maximum width of an element.

max-height or max-width you to constrain the height and/or width of an element to a maximum value. For more information, see max-height and max-width.

Example showing max-width

div {
    max-width: 500px;
    height: 100px;
    background-color: powderblue;

My max-width is 500px

Leave a Reply

Your email address will not be published. Required fields are marked *