CSS border-width Property

CSS border-width property is a shorthand property for setting all the border width properties in one statement.

Following properties can be sets,

Usages

The following table outline the usages and version history of this property.

Default value: medium
Applies to: All elements
Inherited: No
Version: CSS1
JavaScript Syntax: object.style.borderWidth = "2px"

Syntax

Here is a syntax for the CSS border-width property

border-width: medium | thin |thick | length | initial | inherit;

Property Values

The following table describes the values of this property.

Value Description
medium Default. Set a medium border
thin Set a thin border
thick Set a thick border
length Set length value in px, pt, cm, em, etc that define border thickness
initial Sets default value of this property
inherit Inherits this property from its parent element

Examples

The example below shows to sets border width.

.outline-1 {
  outline-width: medium;
}
.outline-2 {
  outline-width: thin;
}
.outline-3 {
  outline-width: thick;
}
.outline-4 {
  outline-width: 5px;
}
.outline-5 {
  outline-width: 5px 10px;
}
.outline-6 {
  outline-width: 5px 10px 2px;
}

Run it...   »

Browser Compatibility

  • Google Chrome 1+
  • Mozilla Firefox 1.5+
  • Internet Explorer 8+
  • Opera 7+
  • Safari 1.2+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.