column-rule-color
Definition
The column-rule-color CSS property sets the color of the dividing lines (rules) between columns in a multi-column layout.
Examples
Specifies the rule color as blue. This value can be any CSS color value, including keywords, hexadecimal values, RGB/RGBA values, and HSL/HSLA values:
column-rule-color: blue;
Specifies the rule color as red, using a hexadecimal value:
column-rule-color: #ff0000;
Specifies the rule color as a semi-transparent green, using an HSLA value:
column-rule-color: hsla(120, 100%, 50%, 0.5);
Values
| Value | Description |
|---|---|
| color | Specifies the color of the column rule. Any valid CSS color value can be used. |
Best Practices
- Choose a column-rule-color that enhances the readability of the content and fits the overall design of the layout.
- Consider using media queries to adjust the column-rule-color based on the screen size.
Browser Compatibility
| Chrome | Firefox | Safari | Internet Explorer | Microsoft Edge | Opera |
|---|---|---|---|---|---|
| Yes | Yes | Yes | Yes | Yes | Yes |