Несколько колонок CSS

Решение, как разделить текст на несколько колонок при помощи CSS

Чтобы разделить текст или список элементов на несколько колонок, воспользуемся CSS свойством column-count

Демонстрация

Контейнер workarea с тремя параграфами:

<div class="workarea">
 	<p>Aenean commodo ligula eget dolor. Sed fringilla mauris sit amet nibh. Nullam accumsan lorem in dui. Etiam rhoncus. Nullam accumsan lorem in dui.</p>
 	
 	<p>Fusce risus nisl, viverra et, tempor et, pretium in, sapien. Nullam sagittis. Aenean massa. Quisque id odio. Suspendisse faucibus, nunc et pellentesque egestas, lacus ante convallis tellus, vitae iaculis lacus elit id tortor.</p>
 	
 	<p>Proin faucibus arcu quis ante. Vestibulum rutrum, mi nec elementum vehicula, eros quam gravida nisl, id fringilla neque ante vel mi. Etiam sit amet orci eget eros faucibus tincidunt. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia. Etiam iaculis nunc ac metus.</p>
</div>

Кроссбраузерное правило column-count с указанием трёх колонок:

.workarea {
	-moz-column-count: 3; /* Для Firefox */
	-webkit-column-count: 3; /* Для Safari и Chrome */
	column-count: 3;
}