Уласцівасць 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-count стаіць у значэнні 3), а вось іх шырыня вылічыцца аўтаматычна:

html<div id="elem">
  some long text
</div>
css#elem {
  column-width: auto;
  column-count: 3;
  text-align: justify;
}

Результат:

Глядзіце таксама

  • уласцівасць column-count,
    якое задае колькасць калонак
  • уласцівасць column-gap,
    якое задае прамежак паміж калонкамі
  • уласцівасць column-rule,
    якое задае мяжу паміж калонкамі
  • уласцівасць column-span,
    якое задае колькасць слупкоў, на якія павінен расцягвацца элемент
  • уласцівасць columns,
    якое з'яўляецца ўласцівасцю-скарачэннем для шматкалонкавасці