CSS - column-gap - とほほのWWW入門

属性名	column-gap
値	<length> \| normal
初期値	normal
適用可能要素	マルチカラムエレメント
継承	継承しない
メディア	visual

CSS	IE/Edge	Firefox	Chrome	Opera	Safari
CSS3	10	2	4	15	3.1

マルチカラムのカラム間の隙間の幅を指定します。カラム間に罫線がある場合は、隙間の中央に描画されます。

値	説明
<length>	マルチカラムのカラム間の幅を指定します。
normal	ブラウザによる標準の隙間を開けます。推奨値は 1em です。

CSS

.multicol {
  column-count: 3;
  column-gap: 5em;
}

HTML

<div class="multicol">
いろはにほへとちりぬるを...
</div>

表示

いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせすんいろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせすんいろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせすんいろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせすん

colums, colum-count, colum-width, colum-rule, colum-rule-color, colum-rule-style, colum-rule-width, break-before, break-after, break-inside, colum-span, colum-fill

CSS - column-gap

概要

サポート (説明)

説明

使用例

関連項目

リンク