紙ものなどのグラフィックからWEB制作に転向するとグラフィックに比べてテキストの制御が甘いことにモヤっとするのは私だけでしょうか…
text-align:justify;でテキストを両端にそろえる
テキストをセンターに持っていきたい場合に重宝するtext-alignを使って両端揃えを完成させます。
See the Pen テキスト両端揃え by sukimadou (@sukimadou) on CodePen.
サンプルコードの上から順に
・左揃え（初期値）text-align:left;
自動で改行されるので右側がガタつきます
・両端揃え text-align:justify;
要素の幅ぴったりにテキストが調整されます
整って見えますね
・センター揃え text-align:center;
よくテキストのみをセンターに持っていきたい時に使います
長文だとあまり見栄えはよくないかな…
text-justifyでさらに微調整
text-align:justify;を指定すると、text-justifyプロパティで均等割つけの形式を選ぶことができます。
①text-justify:auto;（初期値）
内容テキストの言語に適した形式の均等割つけ
②text-justify:none;
均等割つけを無効にする
③text-justify:inter-word;
単語をスペースで区切る言語向け（英語に向いてる）
単語の区切りで均等割つけを調整する
④text-justify:inter-character;
文字の間隔を調整して均等割つけ（日本語に向いてる）
よほど変に表示されない限りは初期値のままで問題ないと思いますよ！
