テキストを両端揃えで表示するCSS

長いテキストで何段かに渡る場合に折り返すところが行によってばらばらになってしまい、気持ち悪い事があります。両端で揃えるためのCSS指定のメモです。

両端揃えにしたい要素に下記のスタイルの指定をします。

text-align: justify;
text-justify: inter-ideograph;

すべてのブラウザで実現できるわけではありませんが、Internet ExplorerとFirefoxで両端がきれいにそろいます。残念ながらSafari、Google Chromeでは両端揃えにはなりませんでした。

Related Article

2 Comments & Tracbacks

  • 中川三男 2016-10-09 7:09 AM

    text-align: justify;
    text-justify: inter-ideograph;
    で両端揃えできましたが、letter-spacingが無視されるようで、一定値になってしまいます。(IEで)
    どうしたらよいでしょうか。

    Reply

    • saori 2016-12-02 10:31 AM

      返信が遅くなり申し訳ありません。
      最近はこういうプロパティもあるようなので、 https://ics.media/entry/14087 ご参考にされてみてはいかがでしょうか

      Reply

Leave a Comment

中川三男 にコメントする コメントをキャンセル

Emailは公開されません。*は必須項目です。


*


Categorys

Tags

CSS3 ダッシュボード ヘッダー トラブル コードサンプル コンテンツ スライドショー jQueryプラグイン php 引っ越し 素材 お知らせ JavaScript Facebook CSS カテゴリー 投稿タイプ IE HTML5 Shareボタン seo レスポンシブ Photoshop タクソノミー ナビゲーション カスタムメニュー Git Macアプリ サイドバー WPセキュリティ SVG iTunes PHPリファレンス API WP使い方 query_posts データベース get_posts() 条件分岐 コメント function RSS スマートフォン Sass/Compass さくらVPS