column-count 속성

column-count 속성은 다단 텍스트의 권장 열 수를 설정합니다. 실제 열 수는 열 너비와 열 사이 간격 크기에 따라 지정된 값과 다를 수 있습니다.

구문

선택자 {
	column-count: 숫자 | auto;
}

값	설명
숫자	지정된 수의 열을 설정합니다. 더 정확히 말하면, 브라우저에게 이 수의 열을 사용하도록 권장하는 것입니다. 실제 열 수는 열 너비와 열 사이 간격 크기에 따라 지정된 값과 다를 수 있습니다.
`auto`	브라우저가 최적의 열 수를 자동으로 선택합니다.

기본값: auto.

이 예시에서 텍스트는 3개의 열로 나뉩니다 (물론 다단 레이아웃을 지원하는 브라우저에서만. 지원하지 않는 브라우저에서는 일반적인 한 열 텍스트로 표시됩니다):

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

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

이 예시에서는 열 너비 column-width를 150px로 설정하고, 열 수 column-count는 auto 값으로 설정했습니다. 브라우저가 필요한 열 수와 열 사이 간격을 자동으로 선택합니다:

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

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