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
<line-width> = <length> | thin | medium | thick- 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.
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