ばけらの CSSリファレンス

レベル:	2
値:	ltr | rtl
初期値:	ltr
適用対象:	あらゆる要素に適用可能
継承:	する
パーセント値:	不可
適用メディア:	視覚

direction プロパティは、書字方向を指定します。ltr が Left To Right すなわち左から右へ、rtl が Right To Left で左から右へ、という指定になります。残念なことに、縦書きの指定は CSS2 にはありません。

このプロパティがブロック要素に指定されているときは、その内容の基本書字方向を規定します。文字の並び方以外にも、書字方向は以下のようなものに影響します。

• 表の列の並び方
• overflow: visible を指定された要素から内容がはみ出すとき、そのはみ出す方向
• text-align: justify が指定されたブロックの中で、最終行が寄せられる方向

なお、このプロパティがインライン要素に指定されていても、通常は機能しません。インライン要素の direction が機能するのは、unicode-bidiが override もしくは embed となっているときだけです。

レベル:	2
値:	normal | embed | bidi-override
初期値:	normal
適用対象:	あらゆる要素に適用可能
継承:	する
パーセント値:	不可
適用メディア:	視覚

英語は左から右に、ヘブライ語は右から左に書かれます。ヘブライ語の中に英語の固有名詞が現れるような場合、全体は右から左へ流れ、固有名詞の部分だけが左から右に書かれます。Unicode の双方向アルゴリズムに対応しているブラウザであれば、このようなヘブライ語と英語の混在した文書を、英語は左から右へ、ヘブライ語は右から左へと流れるようにうまく表示できます。

※なお、実際の文字符号化方式が何であれ、HTML の文字は ISO 10646 の文字として扱われますから、Unicode の双方向アルゴリズムは有効です。実際にそのような実装がされているかどうかは別の話ですが。

しかし中には、

• データ自体が書字方向を意識して配置されている
• 英語を含むヘブライ語を引用した英文をヘブライ語の文章の中に引用する

などといったケースがあって、Unicode の双方向アルゴリズムがうまく働かない場合があります。そんなときには Unicode の双方向アルゴリズムを上書きして無効にすることが出来ます。unicode-bidi プロパティは、この Unicode の双方向アルゴリズムを制御します。

unicode-bidi の初期値は normal で、このときは Unicode の書字方向アルゴリズムに対しては全く干渉しません。

embed とすると、特定の書字方向の要素を「埋め込む」ことになります。要素の書字方向は、directionプロパティによって決まります。このとき、その要素の中で Unicode の双方向アルゴリズムは有効です。

bidi-override は、その名のとおり双方向アルゴリズムを「上書き」します。unicode-bidi: bidi-override とされた要素の中では、書字方向は direction プロパティの値に従い、Unicode の双方向アルゴリズムは無効となります。