text-align: justify; が効かない時の解決方法

テキストの両端揃えをする際に、CSSの ‘text-align: justify;’ を使うことが多いですが、これが1行だけのテキストには効果を発揮しません。そこでこの記事では、そのような場合にどのように対処するかを説明します。

text-align-last: justify; の使用方法

1行だけのテキストで ‘text-align: justify;’ が効かない場合、代わりに ‘text-align-last: justify;’ を使用することで問題を解決できます。

<p style="text-align: justify; text-align-last: justify;">
  この文章は一行ですが、全体が揃って表示されます。
</p>

上記のように、’text-align-last: justify;’ を使用することで、最後の行でもテキストが両端に揃うようになります。これは、段落の最終行だけでなく、一行だけのテキストにも適用可能です。

ただし、’text-align-last’ プロパティは一部の古いブラウザではサポートされていないため、その場合は他の方法を検討する必要があります。常に最新のブラウザを使用し、ウェブページの互換性を確認することをおすすめします。

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

上部へスクロール