一行展示不下，如何隐藏单个dom?

有这么一个UI交互，一行需要“展示全”三个标签，如果最后一个不能展示全（文案需要全部展示出来，不能出现省略号），那么就展示成两个；如下图，最后一个应省略

代码如下：

  <style>
    .container {
      width: 260px;
      overflow: hidden; 
      white-space: nowrap; 
      text-overflow: ellipsis;
      border: 1px solid #000;
      font-size:0; /* 为了隐藏省略号 */
    }

    span {
      display: inline-block; /* 不出现任何文案，能让整块显示省略号 */
      margin-right: 8px;
      padding: 0 6.5px;
      background: #FFEBEB;
      color: #AC4343;
      box-sizing: border-box;
      font-size: 20px;
    }
  </style>
  <div class="container">
    <span>javascript</span>
    <span>html</span>
    <span>express and koa</span>
  </div>

展示效果

修改代码

  <div class="container">
    <span>javascript</span>
    <span>html</span>
    <span>koa</span>
  </div>

我们将最后一个item的文案缩短，发现就能正常展示出来了