Свойство column-width

Свойството column-width задава ширината на колоните в многоколонен текст. Стойността на свойството са всякакви единици за размери, с изключение на проценти, или ключовата дума auto (по подразбиране). При стойност auto браузърът сам подбира оптималната ширина на колоните въз основа на column-count и column-gap.

Синтаксис

cssселектор {
  column-width: стойност;
}

Пример . Указана ширина

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

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: auto;
  column-width: 150px;
  text-align: justify;
}

Результат:

Пример . Стойност auto

В този пример текстът ще се раздели на 3 колони (тъй като column-width е със стойност 3), а тяхната ширина ще се изчисли автоматично:

html<div id="elem">
  some long text
</div>

css#elem {
  column-width: auto;
  column-count: 3;
  text-align: justify;
}

Результат:

Вижте също