text-overflow: ellipsis不生效的几种情况
正常的写法：

.firstLineEllipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}
不生效的原因和解决办法：

1.没有给容器添加固定宽度
2.容器不可以是flex布局，若要使用flex布局，可以用flex布局的父元素包裹

文章原文：text-overflow: ellipsis不生效的几种情况_猫丞丞和兔飞飞~的博客-CSDN博客