Свойство column-span

Свойство column-span задает количество столбцов, на которые должен растягиваться элемент в многоколоночном тексте.

Свойство значением принимает либо число 1, либо ключевое слово all. При значении 1 элемент будет охватывать одну колонку, а при значении all - все колонки.

Синтаксис

селектор {
	column-span: 1 | all;
}

Значение по умолчанию: 1.

Пример

В данном примере заголовок попадет вовнутрь первой колонки:

<div id="elem">
	<h2>Lorem ipsum dolor sit amet eu metus non</h2>
	некий длинный текст
</div>

#elem h2 {
	column-span: 1;
	margin: 0;
}
#elem {
	column-count: 3;
	text-align: justify;
}

Пример

А теперь заголовок растянется на все колонки:

<div id="elem">
	<h2>Lorem ipsum dolor sit amet eu metus non</h2>
	некий длинный текст
</div>

#elem h2 {
	column-span: all;
	margin: 0;
}
#elem {
	column-count: 3;
	text-align: justify;
}

Смотрите также

свойство column-count,
которое задает количество колонок
свойство column-width,
которое задает ширину колонки
свойство column-gap,
которое задает промежуток между колонками
свойство column-rule,
которое задает границу между колонками
свойство columns,
которое является свойством-сокращением для многоколоночности