プロパティ column-width

プロパティ column-width は、 マルチカラムテキストにおけるカラムの幅を指定します。値には、 パーセントを除くサイズの単位、 またはキーワード auto（デフォルト）を使用します。 値が auto の場合、ブラウザは column-count と column-gap に基づいて、 最適なカラム幅を自動的に決定します。

構文

cssセレクタ {
  column-width: 値;
}

例 . 幅の指定

この例では、カラムの幅 column-width を 150px と指定し、カラム数 column-count は auto に設定しています。結果として、 カラムの幅は 150px になり、その数と間隔は ブラウザが自動的に決定します：

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: auto;
  column-width: 150px;
  text-align: justify;
}

Результат:

例 . auto 値

この例では、テキストは 3 つのカラムに分割されます （column-count が 3 に設定されているため）。 カラムの幅は自動的に計算されます：

html<div id="elem">
  some long text
</div>

css#elem {
  column-width: auto;
  column-count: 3;
  text-align: justify;
}

Результат:

関連項目