borderLeft

Border-left is a CSS property that defines the left border of an element. It controls the border’s width, style, and color for the left edge, and is one part of the broader set of border properties used to style element borders. In CSS, the left border can be targeted individually with border-left or together with other borders using the shorthand border.

Syntax and values: border-left: <border-left-width> <border-left-style> <border-left-color>; or via the individual longhand properties border-left-width, border-left-style, and border-left-color. Width can be a length (for example, 2px or 0.5em) or one of the keywords thin, medium, or thick. Style can be none, hidden, dotted, dashed, solid, double, groove, ridge, inset, or outset. Color accepts any valid color value, such as hex, rgb(), or named colors. If the left style is none or the left width is 0, the border is not visible regardless of color.

Browser support and usage: border-left is part of CSS2.1 and is supported by all major browsers without prefixes. The property is not inherited by default; borders are applied to the element’s left edge unless overridden on descendant elements. It can be combined with the overall border shorthand to set all sides at once, or with other border-* properties to fine-tune the left edge specifically.

Related properties: border, border-left-color, border-left-width, border-left-style, as well as the corresponding right, top, and bottom border properties. In the DOM, the equivalent JavaScript property is borderLeft when manipulating inline styles.