複数行を三点リーダーで省略する（EI11対応） - Qiitaテキスト省略をCSSで行たい理由 親要素の横幅に収まるように、テキストを三点リーダーで省略したい場合、 CSSで行うのが簡単でシンプルです。 サーバーサイドで文字数を元に切り捨てた場合、HTML上に全文が載らないため、 title属性やその他UIで全文を表示させる時に不便です。 また、レスポンシブの場合は尚更CSSで行えると実装が楽です。 注意 IE11対応とありますが、三点リーダーはIE11では表示されません。（行数で切り捨て表示するのみ） 単一行はCSSのみで実装 単一行の場合は、下記CSSを適用することで、親要素の横幅を超えた分を「...」で省略できます。 こちらはIE11を気にせず使用できます。 p { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 複数行はJav
