JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ellipsis">
    <div class="blah">
     <span>
        <p>Call me Ishmael. Some years ago &ndash; never mind how long precisely &ndash; having little or no money in my purse, and nothing particular to interest me on shore, I thought I would sail about a little and see the watery part of the world. It is a way I have of driving off the spleen, and regulating the circulation. Whenever I find myself growing grim about the mouth; whenever it is a damp, drizzly November in my soul; whenever I find myself involuntarily pausing before coffin warehouses, and bringing up the rear of every funeral I meet; and especially whenever my hypos get such an upper hand of me, that it requires a strong moral principle to prevent me from deliberately stepping into the street, and methodically knocking people's hats off &ndash; then, I account it high time to get to sea as soon as I can.</p>
        </span>
        </div>
    </div>

CSS

html, body, p {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
}
.ellipsis {
    height: 100px;
    border: 5px solid #AAA;
}

.blah {
    overflow: hidden;
    height: 1.2em;
   line-height: 1.2em;
   display: block;

}
.blah:before {
    content:"";
    float: left;
    width: 5px;
    height: 3.6em;
}
.blah > *:first-child {
    float: right;
    width: 100%;
    margin-left: -5px;
}