根据谷歌员工在这里的评论
box-orient(以及它的webkit变体)是遗留下来的非标准属性,来自旧版本的flexbox规范。与其相关的任何错误可能都与此有关。
因此,在下面的代码中,我想要删除以下样式display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
and replace them with new flexbox specs, how can I do that the desired result is to clamp lines at 2 lines length as in the demo (text-overflow to ellipsis)
<div style="min-height: 128px;
border-radius: 7px;
box-shadow: 0 2px 4px 0 rgba(210, 210, 210, 0.5);
border: solid 0.3px rgba(26, 25, 25, 0.15);
background-color: #ffffff;
width: 268px;
margin-bottom: 13px;">
<div style="overflow: hidden;
text-overflow: ellipsis;
padding-top: 5.6px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;">
Can we make this upper case? and also remove the word and’? Can we make this upper case? and also remove the word and’? Can we make this upper case? and also remove the word and’? Can we make this upper case? and also remove the word and’? Can we make
this upper case? and also remove the word and’? Can we make this upper case? and also remove the word and’?
</div>
</div>
注意: 这个更改的原因是,当HTML元素在默认情况下隐藏时,这种样式不起作用,如Github问题所述。工作中的Angular演示在这里