text-wrapプロパティは、テキストの折り返し方法を指定する際に使用する。
.balanced {
max-inline-size: 50ch;
text-wrap: balance;
}- normal：改行ルールにしたがって改行ポイントで改行される（初期値）
- nowrap：改行しない。テキストはコンテナブロック内に収まらずオーバーフローする
- balance：テキストのバランスを調整する。テキストをバランスよく配置するために、ブラウザは行を増やさない最小の幅をバイナリ検索し、CSSの1ピクセル（表示ピクセルではない）で停止させる。バイナリ検索のステップをさらに最小限にするために、ブラウザは平均的な線幅の80%から開始する。
※text-wrap:balanceは最大4行までのテキストしか機能しないため注意する。そのため、タイトルや見出しには最適だが、本文などの長いコンテンツには向かない。
text-wrap: pretty;
perttyは、文末が1語にならないように文字が折り返される値になる。
ただperttyは、スピードやパフォーマンスよりもレイアウトに最適化した値を明示的に選ぶことになるので注意が必要である。
.pretty {
text-wrap: pretty;
margin: 8px 0 0;
}