CSS multi-column layout allows easy definition of multiple columns of text. Below are a few CSS properties to make a multi-column layout:
1. column-count: The ‘column-count’ property specifies the number of columns an element should be divided into.
Example:
```
div {
column-count: 3;
}
```
1. column-gap: The ‘column-gap’ property specifies the gap between the columns.
Example:
```
div {
column-count: 3;
column-gap: 40px;
}
```
1. column-rule: The ‘column-rule’ property specifies a rule between columns.
Example:
```
div {
column-count: 3;
column-gap: 40px;
column-rule: 4px double blue;
}
```
1. column-width: The ‘column-width’ property specifies the width of the columns.
Example:
\`\`\`css
div {
column-width: 100px;
}
\`\`\`
Use this property when you want the browser to decide the number of columns based on the width you set.
NOTE: The browser automatically adjusts the column widths and the column count based on the container width, but you can also set these properties explicitly.
Remember, the multi-column layout properties are not fully supported in all browsers. Make sure to check the compatibility of these properties with different browsers.
