.columns { column-count: 3; column-rule: 2px solid #333; column-rule-width: 4px; }
The 'column-rule-width' property is used to specify the width of the rule between columns in a multi-column layout. It allows you to define the thickness of the line separating columns.
.multi-column { column-count: 3; column-rule-style: solid; column-rule-color: #333; }
The 'column-rule-style' CSS property is used to specify the style of the rule between columns in a multi-column layout. It allows you to set different styles such as solid, dotted, dashed, double, etc.
.container { column-count: 3; column-rule: 2px solid #333; column-rule-color: blue; }
The 'column-rule-color' CSS property sets the color of the rule between columns in a multi-column layout. It applies to block containers that are split into multiple columns using the 'column-count' or 'column-width' properties.
.container { column-count: 2; column-rule: 2px dashed #333; }
The 'column-rule' property is used in multi-column layouts to set the style, width, and color of the rule between columns. It allows you to customize the appearance of the rule that separates columns.
.multi-column { column-count: 3; column-gap: 20px; }
The 'column-gap' property in CSS sets the gap between columns in a multi-column layout. It allows you to specify the width of the gap between columns.