Definition and Usage
The border-left CSS property is a shorthand that sets the values of border-left-color, border-left-style, and border-left-width. These properties describe the left border of elements.
The three values of the shorthand property can be specified in any order, and one or two of them may be omitted.
- Initial the concatenation of the initial values of its longhand properties:
- border-left-width: medium
- border-left-style: none
- border-left-color: currentColor
- Applies to all elements
- Inherited no
- Media visual
- Computed Value as each of the properties of the shorthand:
- border-left-width: the absolute length or 0 if border-left-style is none or hidden
- border-left-style: as specified
- border-left-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:
- Canonical order order of appearance in the formal grammar of the values
Syntax
Formal syntax: <br-width> || <br-style> || <color>
Values
- <br-width>
- See border-left-width.
- <br-style>
- See border-left-style.
- <color>
- See border-left-color.
Examples
element { border-left: 1px solid #000; }
Compatibility
Desktop browsers
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 1.0 | 1.0 (1.7 or earlier) | 4 | 3.5 | 1.0 (85) |
Mobile browsers
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | 1.0 | 1.0 (1.0) | (Yes) | (Yes) | (Yes) |