CSS - column-gap

トップ > CSSリファレンス > column-gap

概要

属性名 column-gap
<length> | normal
初期値normal
適用可能要素マルチカラムエレメント
継承継承しない
メディアVisual
サポートC3 / e10 / Fx2 / Ch4 / Op15 / Sa3.1

説明

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

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

使用例

CSS
.multicol {
  -webkit-column-count: 3;
     -moz-column-count: 3;
          column-count: 3;
  -webkit-column-gap: 5em;
     -moz-column-gap: 5em;
          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

リンク


Copyright (C) 2015 杜甫々
初版:2015年10月25日、最終更新:2015年10月25日
http://www.tohoho-web.com/css/prop/column-gap.htm