我在div中有一个span，如下所示：

正如您所看到的，当您使用text-overflow: ellipsis时，文本溢出，但不像通常那样溢出三个点。
这是我的相关html：

<div class="row main">
    <span class="kurzbezeichnung">
      <mat-icon svgIcon="file"></mat-icon>
      Hello! This is a longer text to see if overflow ellipsis effect will get
      applied!
    </span>

    //here is some more stuff of course, but this is the relevant code
</div>

这是相关的CSS：

.row {
  & span {
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
  }
}

.kurzbezeichnung {
  width: 150px;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.row {
  display: flex;
  flex-direction: row;
  gap: 18px;
  width: 100%;
}

为什么没有这三个点会溢出？