动态循环添加的text为什么会自动换行

如图，写死了第一个text：主演，然后后面都是循环添加的text，没加样式，但是却自动换行了、可以看到高亮的父元素的宽度是正常的包括所有的text的宽度。

.actorBox{  display: flex;  justify-content: flex-start;  align-items: center; } .actorBox text{  color: #666;  font-size: 12px;  height: 20px;  line-height: 20px; }

另一问题就是text超出文本不显示省略号。和上面的问题是两个独立的问题。css也没联系

.title {  width: 100%;  text-align: left;  height: 20px;  text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden;  /* white-space: pre-line */ }