Compass(Sass)でテキスト省略（ellipsis）を楽に書く

テキストが一定幅に収まらなかった場合「…」と省略するCSS手法に text-overflow:ellipsis を使う方法がありますが、Compassの記述を使えば一行でクロスブラウザ対応まで済ませます。

Sass側の記述は下記。

.box {
    @include ellipsis(no-wrap);
}

CSSに下記のように出力されます。

.box {
  white-space: nowrap;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
}