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;
}

Результат:

Տես նաև