CSS:今日から始める縦書き表現2

前回に引き続きcolumn-widthを指定することでレイアウトしてみることにします。

DEMO:縦書き(column-width)固定

Firefox以外高さを入れないと、妙な空きができてしまいます。
IEの場合テキスト量が段毎に同じように割り振られてしまうようでcolumn-fill:auto;を入れました。
(デフォルトでcolumn-fill:auto;のはずですが明示的に入れないとダメなようです。)

column-widthだけを指定して可変長のテキストが自動でうまく収まればブログなどでも使えそうですが、ちょっと難しそうです。

使い所としてはポイント的な差し込みで使うことは可能なので今度はそういった例にチャレンジしたいと思います。

広告

CSS:今日から始める縦書き表現2」への1件のフィードバック

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中