Как использовать text-overflow внутри бутстраповской колонки?

Question

[alexnotonfire]

Представьте, что у меня есть row с фиксированной высотой и я вставил какой-то текст в его колонку. Если текст слишком длинный, я хочу, чтобы он обрезался и вконце последней видимой строки ставились три точки, как в примере.



Я использую аттрибут text-overflow: ellipsis; в своей строке, но это почему-то не работает.

JsFiddle

Что я делаю не так?

HTML

<div class="container">
  <div class="row text">    
    <div class="col-xs-4" style="border: solid">
 Some really long text!  Some really long text!  Some really long text!  Some really long text! The end! Some really long text! The end! Some really long text! The end! Some really long text! The end!
    </div>
  </div>        
</div>

.row {
    margin: 2px 0;
}

.text {
    word-wrap: break-word;
    height: 50px;
    text-overflow: ellipsis;
}

Answer 1

[Михаил Чирский]

К сожалению данный способ, работает только в 1 строчку.
Примерно так: JsFiddle

Answer 2

[Дмитрий Кравченко]

вебкит может мультилайн