CSS border-left-style

The border-left-style property sets the line style for the left border of an element. Without a visible style, border width and border color will not draw anything.

Syntax

border-left-style: none;
border-left-style: solid;
border-left-style: dashed;
border-left-style: dotted;
border-left-style: double;

Example

.note {
  border-left-width: 0.35rem;
  border-left-style: solid;
  border-left-color: #f97316;
  padding: 1rem;
}
Result:
A note highlighted with a left border.

When to use it

Left borders are often used for notes, quotes, warnings and side markers in documentation. For layouts that must adapt to writing direction, consider border-inline-start-style.

Related CSS topics