In this section, we will learn what the outline-width property is and how to use it in CSS.
Click here to run the outline-width property.
CSS outline-width Property Definition and Usage
The CSS `outline-width` property is used to set the width of the outline of an element.
Note: before setting this value, you should set the `outline-style` property, otherwise you won’t see any border. This property is explained in the outline-style section.
CSS outline-width Property Syntax
outline-width: medium|thin|thick|length|initial|inherit;
CSS outline-width Property Value
The value we set for this property can be either:
- thin: using this value, the outline will have a thickness somewhere around 1px.
- medium: using this value, the outline will have a thickness around 3px.
- thick: using this value, the outline will have a thickness around 5px.
Also, you can set number as the value for this property. Any CSS supported units can be used for this property.
Note: you can use percentage value for this property.
Note: the two global values “initial” and “inherit” could also be used.
Example: outline-width in CSS
See the Pen outline-width in CSS by Omid Dehghan (@enjoytutorials1) on CodePen.