文本溢出：省略号不起作用的有限行显示

Question

jsfiddle代码： https://jsfiddle.net/JaneChen/gu7tf864/1/

<span class="fileName" >long name file to display long name file to displayddddddssdd moreggggg lines more lines more more more lines</span>

.scss：

.fileName {
   @font-size: 17px;
   @line-height: 1.3;
   @lines-to-show: 3;

  -webkit-font-smoothing: antialiased;
  -webkit-line-clamp: 3;
    display: inline-block;


  overflow:hidden;
  display: -webkit-box;


  text-overflow: ellipsis;
  width: 175px;


  font-size: 17px;
  line-height:  1.4;
  max-height: 71.4px;
}

文本块显示为3行，但省略了文本截断时的省略号。这是为什么 ？有办法解决吗？谢谢！

Answer 1

你忘记了

white-space: nowrap;

检查结果 https://jsfiddle.net/gu7tf864/3/

Answer 2

你忘了

-webkit-box-orient: vertical;