以下のブラウザで、縦書き変換 / 表示が可能です。
- Firefox 3.5+
- Safari 3+
- Google Chrome
- Internet Explorer 8+
- Opera 10.5+
また、以下のブラウザでは縦書きレイアウトがズレてしまうことを確認しています。
- Mobile Safari @iPhone ← 対応しました。もうそんなにはズレません。
- Sleipnir Mobile @iPhone ← 対応しました。もうそんなにはズレません。
- Internet Explorer 7 ← IE 7以下のバージョンではムリに縦書き変換しないようにしました。
- Operaの一部のバージョン
Operaについては、Operaの「スタイル指定の際の font-family設定まわりの不具合」が原因のような気がするので、対処は難しいかもしれません。
htmlの推奨タグのほとんどは、それなりに綺麗な縦書き表示に変換できます。それぞれの要素に指定されたスタイルも有効です。
縦書きエリア内の要素に position , left , top , right , bottom , float といったプロパティを設定すると、縦書きに変換したときにレイアウトがズレる原因となります。なんとか頑張って、marginやpaddingで要素の位置決めを行ってください。
- 以下のブロック要素は使用可能で、ブラウザデフォルトのスタイル、またはページで定義されたスタイルを継承します。
- H1 , H2 , H3 , H4 , H5 , H6
- UL , OL , DL
- BLOCKQUOTE , P
- DIV
- 以下のブロック要素は使用可能で、ブラウザデフォルトのスタイル、またはページで定義されたスタイルを継承します。ただしリストの先頭に表示するマーカーは「・」に統一されます。
- CENTER はセンタリングを行いません。その他のスタイルは維持されます。
- 以下のインライン要素は使用可能で、ブラウザデフォルトのスタイル、またはページで定義されたスタイルを継承します。
- SPAN
- FONT , STRONG , B , BIG , SMALL , I , EM , SUB , SUP
- A
- IMG
SUBおよびSUPは、縦書きではあまり意味が無いかもしれません。
また、Windowsでメイリオフォントがインストールされている環境では、和文字の斜体が通常の文字スタイルで表示されます。これはメイリオが「和文字の斜体字」という文字形をもともと持っていないためです。
- 以下の要素 および これらの要素の内部は縦書きに変換されません。横書き時のスタイルのまま表示されます。
- PRE , IFRAME , TABLE , TEXTAREA
これらの要素を縦書き変換エリアに含める場合は、widthを明示してやったほうが安全です。横幅がフレキシブルなのであれば、この要素は縦書きエリアの外に置くほうが良いでしょう。
- 改行タグBRはもちろん使用可能です。
- 罫線タグHRは使用可能ですが、縦書きでは意味が無いかもしれません。