CSS border-width Property

Description

The border-width property specifies the border width of an element. Used as a shortcut to determine the entire border width in one rule.

Initial value

See individual properties

Applies to

All elements

Inherited

No

Media

Visual

Computed value

See individual properties

Animatable

Yes

CSS Version

CSS1, CSS2, CSS3

JavaScript syntax

object.style.borderWidth

Syntax

border-width: <line-width>{1,4} 

Values

• thinLess than the default width.
• mediumDefault value.
• thickGreater than the default width.
• <length>Floating-point number, followed by an absolute units designator (cm, mm, in, pt, or pc) or a relative units designator (em, ex, or px).
• inherit

Example

<div class="border">This is an example of the border-width property using a purple solid border 2px in width.</div>

.border {
   border-style: solid;
   border-width: 2px;
   border-color: purple;
   margin: 20px;
   padding: 20px;
}

Give it a Try

Click the button below to experiment with this property.

Give it a Try!

Browser Support

Desktop
4	12	1	1	3.5	1
Tablets / Mobile
2	18	4	10.1	3	?

Last updated by CSSPortal on: 12th October 2019