CSS column-fill| CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル

column-fill CSS プロパティとは

トピック：マルチカラム要素の列の長さは、コンテンツフローによって影響される方法を指定する ことができる 複数列のレイアウトのコンテンツはバランスがとれています。つまり、autoという値を使用する場合、すべての列のコンテンツの高さが同じになる

プロパティ column-fill

基本 書式：セレクタ {column-fill:値;}

情報：
• column-fillプロパティを使用すると、複数列レイアウトの列間でコンテンツの均等なバランスをとることができる。

実例 コード 1

プロパティ 定義と使用法

プロパティ値

CSS 実例 サンプル：columns: 3; column-fill: auto; column-rule: 2px dotted coral;
• auto段は順に埋められます。コンテンツは必要な分だけ領域を占有します。balanceコンテンツは各段に均等に分割されます。ページメディアでは、最後のページのみが均等に分割されます。balance-allコンテンツは格段に均等に分割されます。ページメディアでは、すべてのページが均等に分割されます。