border-bottom-width

Controls the thickness of the bottom border. It is frequently paired with a specific color to create focus indicators or status bars.

Quick example

.notification-banner {
  background: #f0f9ff;
  /* Adds a subtle 1px line at the very bottom */
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #bae6fd;
}

Quick facts

Initial value
medium
Inherited
No
Applies to
all elements
Animation type
length

border-bottom-width Browser Support

Widely available Since 2015 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.

Safe to use without fallbacks.

1+
1+
1+
12+
ESC