border-bottom property CSS Reference

Definition and Usage

The border-bottom CSS property is a shorthand that sets the values of border-bottom-color, border-bottom-style, and border-bottom-width. These properties describe the bottom border of elements.

  • Initial the concatenation of the initial values of its longhand properties:
    • border-bottom-width: medium
    • border-bottom-style: none
    • border-bottom-color: currentColor
  • Applies to all elements
  • Inherited no
  • Media visual
  • Computed Value as each of the properties of the shorthand:
    • border-bottom-width: the absolute length or 0 if border-bottom-style is none or hidden
    • border-bottom-style: as specified
    • border-bottom-color: If the value is translucent, the computed value will be the rgba() corresponding one. If it isn't, it will be the rgb() corresponding one. The transparent keyword maps to rgb(0,0,0).
  • Animatable as each of the properties of the shorthand:
    • border-bottom-color: yes, as a color
    • border-bottom-style: no
    • border-bottom-width: yes, as a length
  • Canonical order order of appearance in the formal grammar of the values


Formal syntax: <br-width> || <br-style> || <color>


See border-bottom-width.
See border-bottom-style.
See border-bottom-color.


element {
  border-bottom: 1px solid #000;


Desktop browsers

FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support1.01.0 (1.7 or earlier)43.51.0 (85)

Mobile browsers

FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support1.01.0 (1.0)(Yes)(Yes)(Yes)

Relative articles