CSS border-width Property

Set a width for the borders:

div {border-width: thin;}

More "Try it Yourself" examples below.

Definition and Usage

The border-width property sets the width of an element's four borders. This property can have from one to four values.

Examples:

border-width: thin medium thick 10px;
- top border is thin
- right border is medium
- bottom border is thick
- left border is 10px
border-width: thin medium thick;
- top border is thin
- right and left borders are medium
- bottom border is thick
border-width: thin medium;
- top and bottom borders are thin
- right and left borders are medium
border-width: thin;
- all four borders are thin

Note: Always declare the border-style property before the border-width property. An element must have borders before you can set the width.

Default value:	medium
Inherited:	no
Animatable:	yes. Read about animatable Try it
Version:	CSS1
JavaScript syntax:	object.style.borderWidth="1px 5px" Try it

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

Property
border-width	1.0	4.0	1.0	1.0	3.5

Value	Description	Demo
medium	Specifies a medium border. This is default	Demo ❯
thin	Specifies a thin border	Demo ❯
thick	Specifies a thick border	Demo ❯
length	Allows you to define the thickness of the border. Read about length units	Demo ❯
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit