Свойство column-span
Описание
Определяет, как должен отображаться элемент в многоколоночном тексте — занимать ширину всех колонок или только одну из них. Обычно, его применяют для заголовков текста или изображений, которые не должны разбиваться на колонки.
Синтаксис
column-span: none | all;Подробности
| Значение | Описание |
| none | Элемент наряду с обычным содержимым занимает ширину одной колонки. |
| all | Элемент занимает все колонки. |
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
#test {
padding: 10px;
column-rule: 3px red solid;
column-count: 2;
}
#test h2 {
column-span: all;
}
</style>
<div id='test'>
<h2>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Magnam, quisquam.</h2>
Далеко-далеко за словесными, горами в стране гласных и согласных живут рыбные тексты. Грамматики осталось великий коварных, решила меня оксмокс океана последний правилами лучше ipsum вопрос продолжил страну снова обеспечивает строчка, напоивший над языком щеке текст моей она. Дороге правилами буквоград сбить своих.
</div>
</body>
</html>Читайте также
Вложенные селекторы
При создании веб-страницы часто приходится вкладывать одни элементы внутрь других. Чтобы стили для этих элементов использовались корректно, помогут вл...
Свойство grid-auto-rows
Определяет размер любых автоматически созданных треков. Неявные треки создаются при явном позиционировании столбцов и строк (через grid-template-rows ...
Свойство list-style-position
Указывает, как будет размещаться маркер относительно текста — маркер обтекается текстом или вынесен за границу элемента списка....
Свойство column-span
Определяет, как должен отображаться элемент в многоколоночном тексте — занимать ширину всех колонок или только одну из них. Обычно, его применяют для ...