column-rule-width
Definition
The column-rule-width CSS property sets the width of the dividing lines (rules) between columns in a multi-column layo
Examples
Specifies the rule width as 1 pixel:
column-rule-width: 1px;
Specifies the rule width as 2 millimeters:
column-rule-width: 2mm;
Specifies the rule width as 3 points:
column-rule-width: 3pt;
Values
| Value | Description |
|---|---|
| <length> | Specifies the width of the rule using a length unit (e.g. px, pt, mm, em, etc.). |
| thin | Specifies a thin rule width. |
| medium | Specifies a medium rule width. |
| thick | Specifies a thick rule width. |
| initial | Specifies the default value. |
| inherit | Specifies that the value should be inherited from the parent element. |
Best Practices
- Choose a column-rule-width that enhances the readability of the content and fits the overall design of the layout.
- Consider using media queries to adjust the column-rule-width based on the screen size.
Browser Compatibility
| Chrome | Firefox | Safari | Internet Explorer | Microsoft Edge | Opera |
|---|---|---|---|---|---|
| Yes | Yes | Yes | Yes | Yes | Yes |