The border-top-width, border-right-width, border-bottom-width and border-left-width CSS properties set the width of one border of an element. The width may be set in px, em, vw or any other length unit. Percentages are not allowed, meaning that border width can't be relative to parent's width/height like padding and margin.
border-bottom-width: 5px; border-left-width: .2em; border-right-width: .5vw;
See length for information on the different units.
A border width property won't show any border without a border-style set. eg.
border-top-width: 5px; won't do it without
border-top-style: solid; or equivalent.
Browser Support: Full
A border-width longhand property sets the width of one of the four borders, while preserving its color and style. This makes it good for overriding a more general property like border or border-width.
The border widths above may also be set using the border-width shorthand:
border-width: 10px 5px;
Borders and width
The width of an element is, by default, the width of the content area. It doesn't include borders or padding. The box-sizing property can be used to include them. This means an element with
width: 100% plus some padding and/or border won't overflow.
Try removing the box-sizing rules to see it for yourself.