Column Recipes

@columns

Expands the code for creating responsive, text-flow columns. This is best used on a rich text element.

• --col-count: The number of desired columns
• --col-min-width: The minimum width a column can be before it stacks
• --col-rule-style: The style of the ruler between columns (solid, dotted, dashed, etc.)
• --col-rule-width: The thickness of the ruler between columns
• --col-rule-color: The color of the ruler between columns
• --col-gap: The gap between columns
• --row-gap: The gap between “rows” (added as margin to the child elements).