[CSS3]column-countで紙面デザインのようなテキストレイアウトにしてみよう

5ヶ月ぶりの更新ですの。
サボってたわけじゃないの。
これには話せば長～～～くなるようなストーリーがありまして・・・。

という訳で入院生活から復活第1弾はcolumn-countいっちゃうよ！

よく紙面デザインで文章が2段、3段と段組してるアレです。
デモを作ったよ。

CSS

p {
	column-count:3;
	-moz-column-count:3;
    -webkit-column-count:3;
}

以上。

IEは？

IEはバージョン10以降ならOKです。

まとめ

デモのサンプル文章を読んだ方少ないと思いますが、読んでみると何やらワードのことが書かれてますね。
ワードで「=rand(A,B)」と入力してエンター叩いてみよう！
Aは段落の数でBは段落の行数

ワードの勉強のできるなんてステキなブログですね！