Example of the column-fill property with the "auto" value:

Source Code: (back to article)

Result: Report an issue

<!DOCTYPE html>

<html>

<head>

<title>Title of the document</title>

<style>

.auto {

column-count: 3;

column-rule: 1px solid black;

-webkit-column-fill: auto;

-moz-column-fill: auto;

column-fill: auto;

}

</style>

</head>

<body>

<h1>Column-fill property example</h1>

This is a bunch of text split into multiple columns. The CSS column-fill property is used to spread the contents evenly across all the columns. This is a bunch of text split into multiple columns. The CSS column-fill property is used to spread the contents evenly across all the columns.

</p>

</body>

</html>