CSSによる両端揃えの問題点とその解決へ向けて - Weblog - Hail2u.net

日本語の文章の場合、両端が揃っているとおさまりが良い。CSSではその両端揃えを行うためにtext-alignプロパティーにjustifyという値が用意されている。完全に日本語だけの段落ならほぼ100%、和欧混在の段落でも9割以上の段落で想定通り機能するが、まれに無残な結果になる。それは自動折り返しで長めの英単語が行頭に来る場合だ。 両端揃えは文字と文字の間を開けることで行われる。日本語だけの段落の場合、ほとんどどこでも改行することができる上、行送りの禁則処理が起こっても最大2文字分なので、行の長さが十分にあればその調整は認識されないだろう。問題は和欧混在の段落だ。 Demo: Justifying Problem この「contemporary」くらいの長さの単語だとまだマシな方で、あまり問題が起こることはない。しかし、このウェブサイトのようにcompareDocumentPosition

[oki448jp]

CSSによる両端揃えの問題点とその解決へ向けて

[teppeis]

text-align:justify と hyphens について。hyphensはChromeが未実装、lang:jaで効かないなど / Chrome 55でhyphens実装する https://blog.chromium.org/2016/10/chrome-55-beta-input-handling.html