border-left-width
Definition
The border-left-width CSS property sets the width of the left border of an element
Examples
This will create a left border on the element with the class example that is 3 pixels wide.
.example {
border-left-width: 3px;
}
This will create a left border on the element with the class example that is medium-width (equivalent to 3 pixels).
.example {
border-left-width: medium;
}
This will create a left border on the element with the class example that is 10 pixels wide.
.example {
border-left-width: 10px;
}
Values
Value | Description |
---|---|
thin | Border width is thin (equivalent to 1px) |
medium | Border width is medium (equivalent to 3px) |
thick | Border width is thick (equivalent to 5px) |
length | Border width is a specific length (e.g. 10px, 2em) |
initial | Sets the border width to its default value |
inherit | Inherits the border width from the parent element |
Best Practices
- Use the thin, medium, and thick values for a quick and easy way to set the border width.
- Use the length value for more precise control over the border width.
- Use the initial value to set the border width to its default value.
- Use the inherit value if you want the element to inherit the border width from its parent element.
Browser Compatibility
Chrome | Firefox | Safari | Internet Explorer | Microsoft Edge | Opera |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |