CSS border-bottom-width Property

Example

Set a width for the bottom border:

div {border-bottom-width: thin;}

Definition and Usage

The border-bottom-width property sets the width of an element's bottom border.

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

Default value:	medium
Inherited:	no
Animatable:	yes.
Version:	CSS1
JavaScript syntax:	object.style.borderBottomWidth="5px"

• Inherited : "Inherited = no" means that it can takes (inherit) it's value from it's parent element.
• object - object in javascript means the element on which border-bottom-width is applied.
• Animatable - "Animatable = yes" means that it can be animated with CSS @keyframes.

Browser Support

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

Property
border-bottom-width	1.0	4.0	1.0	1.0	3.5

CSS Syntax

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

Property Values

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

More Examples

Example

Set the width of the bottom border to medium:

div {border-bottom-width: medium;}

Example

Set the width of the bottom border to thick:

div {border-bottom-width: thick;}

Example

Set the width of the bottom border to 1px:

div {border-bottom-width: 1px;}

Example

Set the width of the bottom border to 15px:

div {border-bottom-width: 15px;}