JSFiddle - React, Tailwind, and code Playground

HTML

<div class="acontainer">
  <ul>
    <li class="background">
      <div class="block1">

      </div>
      <h3 class="clamp">
        This foo test asdas asdassd saasas dasasa asdasadsd asasddas asdadsg gfhfhg gddfd sddsfsdf
      </h3>
      <div>
        Something
      </div>
      <div>
        Something else
      </div>
    </li>
    <li class="background">
      <div class="block1">

      </div>
      <h3>
        This foo test
      </h3>
      <div>
        Something
      </div>
      <div>
        Something else
      </div>
    </li>
    <li class="background">
      <div class="block1">

      </div>
      <h3>
        This foo test
      </h3>
      <div>
        Something
      </div>
      <div>
        Something else
      </div>
    </li>
  </ul>
</div>

CSS

h3
{
  margin: 0;
  font-size: 13px;
}

ul
{
  list-style: none;
  padding: 0;
  margin: 0;
}

li
{
  display: inline-block;
  margin: 2px;
  padding: 0;
  vertical-align: top;
}

.acontainer
{
  background-color: yellow;
  width: 500px;
  padding: 15px;
}

.background
{
  background-color: grey;
  width: 196px;
}

.block1
{
  height: 110px;
  width: 195px;
  background-color: red;
}

.clamp
{
  display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}