Egenskapen column-width

Egenskapen column-width anger bredden på kolumnerna i text med flera kolumner. Värdet på egenskapen är vilken enhet för storlekar som helst, förutom procent, eller nyckelordet auto (som standard). Med värdet auto väljer webbläsaren själv den optimala kolumnbredden baserat på column-count och column-gap.

Syntax

selektor {
	column-width: värde;
}

Exempel . Angiven bredd

I detta exempel har kolumnbredden column-width angivits till 150px, och deras antal column-count är satt till värdet auto. Som ett resultat kommer kolumnbredden att vara 150px, och deras antal och mellanrummet mellan dem kommer webbläsaren att välja själv:

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

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

Exempel . Värdet auto

I detta exempel kommer texten att delas upp i 3 kolumner (eftersom column-count är satt till 3), men deras bredd kommer att beräknas automatiskt:

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

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

Se även

egenskapen column-count,
som anger antalet kolumner
egenskapen column-gap,
som anger mellanrummet mellan kolumner
egenskapen column-rule,
som anger ramen mellan kolumner
egenskapen column-span,
som anger antalet kolumner som ett element ska sträcka sig över
egenskapen columns,
som är en genvägsegenskap för flerkolumnslayout