column-gap | Справочник CSS
http://belarusweb.net
Основы создания сайтов

column-gap

Описание

css-свойство column-gap (от англ. column gapинтервал между колонками) задает расстояние между колонками в многоколоночном элементе.

Характеристики

  • Значение по умолчанию: normal.
  • Применяется: к многоколоночным элементам, flex-контейнерам, grid-контейнерам.
  • Наследуется: нет.
  • Анимируется: да.
  • JavaScript: object.style.columnGap="value".

Синтаксис

column-gap: normal | <интервал>

Значения

  • normal – браузер будет устанавливать интервал между колонками автоматически.
  • интервал – любые доступные в CSS единицы измерения (смотреть). Отрицательные значения не допускаются.

Ссылки

Примеры

HTML Результат BwCodes
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
		
		p{
		width: 400px;
		height: 300px;
		margin: 1em;
		padding: 0.7em;
		border: 1px solid green;
		column-count: 3;
		}
		
		.p_1{column-gap: normal;}
		
		.p_2{column-gap: 5em;}

	</style>
	
</head>
<body>

	<p class="p_1">
		Текст текст текст текст текст текст текст 
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст		
	</p> 
 
	<p  class="p_2">
		Текст текст текст текст текст текст текст 
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
		текст текст текст текст текст текст текст
	</p>
	
 </body>
</html>	

Пример №1