cssのword-wrapとword-breakの設定をすぐ忘れるのでメモ。

 

1. 両端揃え、英語単語の分割禁止

英単語間もしくは日本語文字間のスペースが拡がって調整。

{

word-wrap: break-word;

word-break: normal;

text-align: justify;

}

 

2. 両端揃え、英語単語の分割許可

両端揃うが英単語の途中でも改行発生。

{

word-wrap: break-word;

word-break: break-all;

text-align: justify;

}

 

3. 両端揃えず、英語単語の分割禁止

右端は揃わない。

{

word-wrap: break-word;

word-break: normal;

text-align: left;

}

 

word-wrap / 単語の分割（日本語は無関係）

• normal :
  単語に対して、改行タグのみで改行。（初期値）・・・表示域からoverflowする
• break-word :
  単語に対して、改行タグ以外でも改行。・・・表示域からoverflowしない

 

word-break / 単語の分割

• normal :
  英数単語は分割禁止（初期値）
• keep-all :
  日本語、英語ともにスペースのみで改行。
• break-all :
  単語の分割許可。
• loose :
  （有用性不明なので省略）
• break-strict :
  （有用性不明なので省略）