CSS: Multi-Column Layout

The Multi-Column Layout in CSS allows content to be divided into multiple columns, similar to how text flows in newspapers or magazines. It uses properties like column-count, column-width, column-gap, column-rule, etc., to control layout behavior.

column-count specifies the number of columns an element should be divided into.

column-width sets an ideal width for the columns. The browser will then fit as many columns as it can without exceeding the width.

column-gap sets the space between columns.

column-rule adds a line between columns with defined width, style, and color.

column-span allows an element like a heading to span across all columns.