W3C home > Mailing lists > Public > public-html-ig-jp@w3.org > July 2010

RE: CSS の left/right/top/bottom と縦書きの関係について

From: Ishii Koji <kojiishi@gluesoft.co.jp>
Date: Sun, 11 Jul 2010 22:49:29 -0400
To: MURAKAMI Shinyu <murakami@antenna.co.jp>, "public-html-ig-jp@w3.org" <public-html-ig-jp@w3.org>
CC: Takayuki Akimoto <akimoto.takayuki@gmail.com>
Message-ID: <A592E245B36A8949BDB0A302B375FB4E09EA72C11A@MAILR001.mail.lan>
> すでに、アラビア語やヘブライ語のWebサイトでは、text-align: right を
> 右寄せに、margin-right を右インデントとして使っています。

これは知りませんでした。それであれば、私のゴールは互換性ですので、村上さんに賛成です。

ご教示、ありがとうございました。


-----Original Message-----
From: MURAKAMI Shinyu [mailto:murakami@antenna.co.jp] 
Sent: Monday, July 12, 2010 11:37 AM
To: public-html-ig-jp@w3.org
Cc: Ishii Koji; Takayuki Akimoto
Subject: Re: CSS の left/right/top/bottom と縦書きの関係について

Takayuki Akimoto <akimoto.takayuki@gmail.com> wrote on 2010/07/12
4:24:37
> >directional-mode: logical をCSS仕様に入れることは、CSS3縦書きを
> >使いやすいものにすることと、現在登場しつつある縦書きEPUBビューア
> >などのHTML/CSSの縦書き実装(縦書きでmargin-leftが上を指す)と、
> >CSS3縦書きとが互換性のあるものにするために意味があります。
> 
> と言うことは、directional-mode: logicalというのは、言わば、
> 「読み替え指令」のようなものでしょうかね。
> 「左」と書いて、「上」と読ませる、
> 「右」と書いて、「左」と読ませるので、
> 「すり鉢」と書いて、「あたり鉢」と読ませる以上の強引さをも
> 感じますが、有用性が高いことは理解しました。

そうです。現実の必要性からのものです。

| block-flow: rl (右縦書き:日本語など)
| =====================================
| logical left   = physical top
| logical right  = physical bottom
| logical top    = physical right
| logical bottom = physical left
| logical width  = physical height
| logical height = physical width

この対応表で logical left = physical top などと書いたのは、
block-flow: rl(右縦書き)のとき、
directional-mode: logical における margin-left は
directional-mode: physical(CSSでの標準)での margin-top に
対応するという意味です。
logical left などの用語を提唱しているわけではありません。

CSSで方向を論理的に表す用語についてはCSSWG内で提案されている次のものを
使うのがよいと思います:
http://lists.w3.org/Archives/Public/www-style/2008Feb/0294.html


Ishii Koji <kojiishi@gluesoft.co.jp> wrote on 2010/07/11 21:30:03
> > この定義について考えなおしてます。'top' と 'bottom' はたぶんOKだけど
> > 'left' と 'right' は右から左(RTL)の書字方向のとき、混乱しそう。
> > 次のようにしたほうがよさそうです:
> 
> この「混乱しそう」と思われたシナリオを教えていただけますでしょうか? RTLネイティブではないので感覚で判断はできませんが、原理的には論理プロパティと同じに扱った方が良い気がしますし、RTLでtext-align:leftが右になる、という部分を見ても、その方が論理的な指示になるような気がします。

すでに、アラビア語やヘブライ語のWebサイトでは、text-align: right を
右寄せに、margin-right を右インデントとして使っています。
もし directional-mode: logical で、left と right が逆になるとすると
それを使うスタイルシートでは、text-align: left で右寄せ、margin-left
で右インデントを指定することになります。
それを directional-mode: logical をサポートしないブラウザで表示すると
スタイルシートの意図とは違った結果になってレイアウトが崩れます。
それでは結局、directional-mode: logical はアラビア語やヘブライ語では
使えないということになってしまいます。

また、縦書きの中で、RTLのテキストがあったとき、その部分は下から上に
表示されます(縦書きの中のLTRの欧文が上から下に表示される逆)。
既存のブラウザをベースにして、directional-mode: logical での縦書きを
実装するような場合に、縦書きでは常に 'left' が上を指すようにするなら
簡単ですが、direction プロパティが ltr なら上、rtl なら下と切り替え
なくてはならないのでは複雑になります。
インライン要素ごとに ltr と rtl が切り替わるときに、行の中で 'left' の
向きが一定しないというのは、混乱しやすいと思います。


-- 
村上 真雄 (MURAKAMI Shinyu)
http://twitter.com/MurakamiShinyu
Antenna House Formatter:
http://www.antenna.co.jp/AHF/
http://www.antennahouse.com
Received on Monday, 12 July 2010 02:50:07 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 12 July 2010 02:50:07 GMT