JSFiddle - React, Tailwind, and code Playground
HTML
<div class="cartItem">
<span class="cartProductTitle">Product</span> <span class="cartProductModel">
Model</span> <span class="cartProductPrice">Price</span>
<span class="cartProductQty">Qty</span>
</div>
<div class="cartItem">
<span class="cartProductTitle">This is the product title</span>
<span class="cartProductModel">mdsdre12es</span>
<span class="cartProductPrice">9.95</span> <span class="cartProductQty">1</span>
</div>
<div class="cartItem">
<span class="cartProductTitle">Product 2</span>
<span class="cartProductModel">mds12es</span> <span class="cartProductPrice">
1119.95</span> <span class="cartProductQty">199</span>
</div>
<div class="cartItem">
<span class="cartProductTitle">This is the product title product 100000</span>
<span class="cartProductModel">as</span> <span class="cartProductPrice">9.95</span>
<span class="cartProductQty">22221</span>
</div>
CSS
.cartItem
{
display: table-cell;
padding: 5px;
width: 600px;
min-width: 600px;
float:left ;
}
.cartProductTitle
{
display: table-cell;
padding: 5px;
width: 350px;
min-width: 350px;
}
.cartProductModel
{
display: table-cell;
padding: 5px;
width: 150px;
min-width: 150px;
}
.cartProductPrice
{
display: table-cell;
padding: 5px;
width: 30px;
min-width: 30px;
}
.cartProductQty
{
display: table-cell;
padding: 5px;
width: 30px;
min-width: 30px;
}