我正在尝试用css制作一个股票代码

我正在尝试制作一个类似于css的股票代码

我要找的是让股票代码用超过一定长度的省略号来缩短名字，并剪掉姓氏

我目前的问题是，它没有切断名称，只是用省略号将它们全部缩短以适应div。我不知道为什么会发生这种情况，因为我使用的是flex-box:nowrap

我当前的代码：

html，
身体{
身高：100%；
背景色：#231C18；
}
身体{
-webkit字体平滑：抗锯齿；
}
.内容{
弹性：1；
柔性生长：1；
弹性收缩：1；
弹性基准：0%；
溢出：自动；
宽度：100%；
自对准：居中；
显示：块；
}
.集装箱{
背景色：#1A1411；
显示器：flex；
弯曲方向：立柱；
溢出：隐藏；
保证金：0自动；
弹性：1；
填充：15px 25px 0 25px；
框大小：边框框；
宽度：100%；
最大宽度：300px；
自对准：居中；
}
.股票代码{
背景色：#342E29；
显示：-ms flexbox；
显示：-webkit flex；
显示器：flex；
对齐项目：居中；
柔性包装：nowrap；
溢出：隐藏；
高度：20px；
边缘顶部：12px；
}
.项目{
空白：nowrap；
溢出：隐藏；
文本溢出：省略号；
最大宽度：75px；
左边距：5px；
右边距：5px；
}

第一项
很长的项目
第三项
第四项

对于最后一项，您可以使用

。项：最后一个子项{text overflow:clip}

？谢谢！我不知道它的存在。