JSFiddle - React, Tailwind, and code Playground

by Abdul Ahmad

HTML

<div class='element'>
  <div class='img'>
    
  </div>
  <div class='element-data'>
    <h3>
      Name
    </h3>
    <p>
      Service
    </p>
  </div>
</div>

<div class='search-summary'>
</div>

SCSS

h3 {
  border: 1px solid red;
  margin-top: 0px;
}

p {
  border: 1px solid blue;
}

.img {
  background-color: teal;
  height: 50%;
  min-height: 150px;
}

.element {
  width: 200px;
  border: 1px dotted red;
  box-sizing: border-box;

  .element-data {
    padding: 4px 10px 10px 10px;
    box-sizing: border-box;
    border: 1px solid blue;
  }
}