CSS width Property

The width property sets an element's width.

Element width is calculated without the padding, margin, or border.

This property accepts any valid CSS length value (e.g. px, %, cm)

Example

#

An element with a specified width.

This element is 180 pixels wide.
<style>
  .my-width {
    width: 180px;
    padding: 15px;
    border: 2px solid lightblue;
  }
</style>

<div class="my-width">
  This element is 180 pixels wide.
</div>

Syntax

width: auto | length | initial | inherit;

Values

#

Value Description
auto Default, browser calculates the width
length Sets width using any valid CSS length values
initial Sets the value to its default value.
inherit Inherits the value from its parent element.

More Examples

An <img> element displayed smaller than its original size.

The Night Cafe, by Vincent van Gogh
<img src="/img/css/night-cafe.jpg"
     style="width:350px"
     alt="The Night Cafe, by Vincent van Gogh">

Browser support

This table shows when width support started for each browser.

Chrome
1.0 Dec 2008
Firefox
1.0 Nov 2004
IE/Edge
4.0 Sep 1997
Opera
3.5 Nov 1998
Safari
1.0 Jun 2003

You may also like

Guides