тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Свойство column-count

Свойство column-count задает рекомендуемое количество колонок в многоколоночном тексте. Их реальное количество может отличаться от заданного, в зависимости от ширины колонки и размера промежутка между ними.

Синтаксис

селектор { column-count: число | auto; }

Значения

Значение Описание
число Задает указанное количество колонок. Точнее, рекомендует браузеру использовать это количество колонок, так как их реальное количество может отличаться от заданного, в зависимости от ширины колонки и размера промежутка между ними.
auto Браузер сам подбирает оптимальное количество колонок.

Значение по умолчанию: auto.

Пример

В данном примере текст разобьется на 3 колонки (конечно же, в браузерах, которые поддерживают многоколоночность, в остальных будет просто обычный текст в одну колонку):

<div id="elem"> некий длинный текст </div> #elem { column-count: 3; text-align: justify; }

:

Пример . Значение auto

В данном примере указана ширина колонки column-width в 150px, а их количество column-count стоит в значении auto - браузер сам подберет необходимое количество колонок и промежуток между ними:

<div id="elem"> некий длинный текст </div> #elem { column-count: auto; column-width: 150px; text-align: justify; }

:

Смотрите также

  • свойство column-width,
    которое задает ширину колонки
  • свойство column-gap,
    которое задает промежуток между колонками
  • свойство column-rule,
    которое задает границу между колонками
  • свойство column-span,
    которое задает количество столбцов, на которые должен растягиваться элемент
  • свойство columns,
    которое является свойством-сокращением для многоколоночности