多行或者单行文本超出两行显示点点点，如果保证内容始终垂直居中？

Question

我现在的需求是这样的，我目前实现了一个div框，显示文字，超出两行显示...，如果单行要保证垂直居中，我如果给容器使用display:flex;align-items:center；则当文字内容过多的时候会不上下文字有截断；

.info_des {
      .margin-all(10, 10, 12, 8);
      display: flex;
      align-items:center;
      div{
        .line-height(21);
        .height(42);
        .font-size(14);
        color: #000;
        letter-spacing: 0.01px;
      }
    }
    
<div class="info_des">
        <div class="line_clamp2">is the leading online shopping platform in is the leading online shopping platform inis the leading online shopping platform in</div>
    </div>

Answer 1

.info_des {
      .margin-all(10, 10, 12, 8);
      display: flex;
      align-items:center;
      .height(42);
      div{
        .line-height(21);
        .font-size(14);
        color: #000;
        letter-spacing: 0.01px;
      }
    }

突然间想明白了解决方法，display:flex；垂直居中的是里面元素的居中，那就给外层div一个固定高度这里是两行文字的行高，里面文字不要给高度，当有一行的时候里面的div高度就是一行的高度就会垂直居中，有两行文字的时候就会显示两行的文字，并且不影响超出显示点点点的效果；

Answer 2

display:box + line-clamp貌似刚好符合你的要求