CSS width Property

CSS

width

Property

Example

Set the width of three <div> elements:

div.a {
  width: auto;
  border: 1px
solid black;
}

div.b {
  width: 150px;
 
border: 1px solid black;
}

div.c {
  width:
50%;
  border: 1px solid black;
}

Try it Yourself »

More “Try it Yourself” examples below.

Definition and Usage

The width property sets the width of an element.

The width of an element does not include padding, borders, or margins!

Note: The min-width and
max-width properties override the width
property.

Show demo ❯

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property

width
1.0
4.0
1.0
1.0
3.5

CSS Syntax

width: auto|value|initial|inherit;

Property Values

More Examples

Example

Set the width of an <img> element using a percent value:

img {
  width: 50%;
}

Try it Yourself »

Example

Set the width of an <input type=”text”> element to 100px. However, when
it gets focus, make it 250px wide:

input[type=text] {
  width: 100px;
}

input[type=text]:focus {
  width: 250px;
}

Try it Yourself »

Related Pages

CSS tutorial: CSS Height and Width

CSS tutorial: CSS Box model

CSS reference: height property

HTML DOM reference: width property