column-width Eienskap

Die eienskap column-width spesifiseer die wydte van kolomme in veelkolom-teks. Die waarde van die eienskap kan enige eenhede vir groottes wees, behalwe persentasies, of die sleutelwoord auto (standaard). Met die waarde auto kies die leser self die optimale kolomwydte gebaseer op column-count en column-gap.

Sintaksis

cssselektor {
  column-width: waarde;
}

Voorbeeld . Gespesifiseerde wydte

In hierdie voorbeeld word die kolomwydte column-width gespesifiseer as 150px, en hul getal column-count is gestel op auto. As gevolg sal die kolomwydte 150px wees, en die aantal kolomme en die spasie tussen hulle sal outomaties deur die leser bepaal word:

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

Результат:

Voorbeeld . Auto waarde

In hierdie voorbeeld sal die teks in 3 kolomme verdeel word (aangesien column-count op 3 gestel is), maar hul wydte sal outomaties bereken word:

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

Результат:

Sien ook

  • die eienskap column-count,
    wat die aantal kolomme spesifiseer
  • die eienskap column-gap,
    wat die spasie tussen kolomme spesifiseer
  • die eienskap column-rule,
    wat die lyn tussen kolomme spesifiseer
  • die eienskap column-span,
    wat die aantal kolomme spesifiseer waaroor 'n element moet strek
  • die eienskap columns,
    wat die verkorte eienskap is vir veelkolom-eienskappe