CSSではみ出した文字を省略する「text-overflow: ellipsis;」がいつの間にかPCでも使えるようになってた!
領域をはみ出したときに三点リーダー(…)で省略するtext-overflow: ellipsis;
は、スマホサイトでは普通に使っていたけど、PCでは数年前に使おうとしてなんかのブラウザでダメだった記憶があって、使えないものとばかり思い込んでいた。
でも、ふとCan I use CSS3 Text-overflowをみたら、めっちゃ対応してた!IEなんて6から対応してるし、Firefoxも7から使えるようになってた。
実際に書いてみたら、いつものこんな感じのコードで普通に使えました。
overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
昔、JSでなんとかそれっぽくできないかみたいに、誰かががんばっていたのはなんだったのか。
わたしみたいに使えないと思い込んでて、意外としらない人いるかもしれないので、ブログに書いてみました。