Widely available 安全に使用可能。両端揃えテキストの最終行制御に便利。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
47
12
49
16
47
16
auto
47
12
12
16
47
16
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)
注釈 2件
削除済み
  • このバージョンで機能が削除されました (53)
対応条件
  • ベンダープレフィックス付きで対応: -moz- (12)

基本構文

CSS
.justified {
  text-align: justify;
  text-align-last: center;
}

.right-last {
  text-align: justify;
  text-align-last: right;
}

ライブデモ

final row center

text-align-last final row center demo.

プレビュー全画面表示

final row right aligned

text-align-last final row right aligned demo.

プレビュー全画面表示

final row justify

text-align-last final row justify demo.

プレビュー全画面表示

実務での使いどころ

  • 雑誌風レイアウト

    両端揃えのテキストで最終行を中央揃えにし、印刷物のような美しい組版を実現する。

注意点

  • 1行しかないテキストにも適用されるため、意図しない揃えにならないよう注意する。

アクセシビリティ

  • 両端揃え(justify)は単語間のスペースが不均一になり、読字障害のあるユーザーにとって読みにくくなる場合がある。