JSFiddle - React, Tailwind, and code Playground

HTML

<div id="mydiv1">Sample text showing wrapping
of text in only two line...</div>
<div id="mydiv2">Sample text showing wrapping
of text in only two line...</div>

CSS

#mydiv1,#mydiv2{
    text-overflow: ellipsis;
    line-height:20px;
    height:40px;
    width:300px;
    border:1px solid blue;
    overflow:hidden;
    white-space: pre;
}
#mydiv1{
    width:300px;
}
#mydiv2{
    width:75px;
}