JSFiddle - React, Tailwind, and code Playground
HTML
<div class="card">
<h4>Test</h4>
<p>
A test or examination (informally, exam) is an assessment intended to measure a test-taker's knowledge, skill, aptitude, physical fitness, or classification in many other topics (e.g., beliefs).[1] A test may be administered verbally, on paper, on a computer, or in a confined area that requires a test taker to physically perform a set of skills. Tests vary in style, rigor and requirements. For example, in a closed book test, a test taker is often required to rely upon memory to respond to specific items whereas in an open book test, a test taker may use one or more supplementary tools such as a reference book or calculator when responding to an item.
</p>
</div>
CSS
.card {
width: 400px;
height: 150px;
background: white;
border: 1px solid #EAEAEA;
box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.18);
padding: 20px;
}
h4 {
margin: 0;
}
p {
text-overflow: ellipsis;
overflow: hidden;
// white-space: nowrap; // Adding 'nowrap' makes the ellipsis work, but does not make use of the vertical space given to the <p> tag.
}