JSFiddle - React, Tailwind, and code Playground

HTML

<div class="card-labels">
  <div class="label-title">
  Product details
  </div>
  <div class="label-title">
  Category
  </div >
  <div class="label-title">
  Quantity
  </div>
  <div class="label-title">
  Price
  </div>
  <div class="label-title">
  Delivery
  </div>
  <div class="label-title">
  Actions
  </div>
</div>

<div class="card-product">
  <div class="product-details">
     <img src="https://images.pexels.com/photos/10164553/pexels-photo-10164553.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260" class="product-image">
     <div class="product-description">
       <div class="product-title">
       Sample product
       </div>
       <div class="product-seller">
       Seller
       </div>     
     </div>

  </div>
</div>

CSS

body{
  background-color: #F3F6FA;
}
.card-labels {
  width: 80%;
  margin: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.card-product {
  width: 80%;
  height: 160px;
  margin: auto;
  background-color: #FFFFFF;
  border-radius: 35px; 
}
.product-details {
  width: 400px;
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
}
.product-image{
  width: 120px;
  height: 120px;
  margin: 20px;
}