JSFiddle - React, Tailwind, and code Playground

HTML

<div class="centerovka">


<div class="pricetov">
    <div class="pricetovn"><h2><b>Заголовок товара</b></h2></div>
    <div class="pricetova">Артикул: <b>45466546</b></div>

    <div class="pricetovc">
      <div style="margin-top: 6px"></div>
      от <span><b>10.000</b></span><span> руб</span>
     <br/>
      <span>В наличии</span>
    </div>

    <a  href="" class="pricetovcorz tooltip" data-title="Добавить в корзину"><i class="fa fa-addcorz"></i></a>

    <a  href=""><div class="pricetovb anim">Смотреть</div></a>
</div>


<div class="pricetov">
    <div class="pricetovn"><h2><b>Заголовок товара</b></h2></div>
    <div class="pricetova">Артикул: <b>45466546</b></div>

    <div class="pricetovc">
      <div style="margin-top: 6px"></div>
      от <span><b>10.000</b></span><span> руб</span>
     <br/>
      <span>В наличии</span>
    </div>

    <a  href="" class="pricetovcorz tooltip" data-title="Добавить в корзину"><i class="fa fa-addcorz"></i></a>

    <a  href=""><div class="pricetovb anim">Смотреть</div></a>
</div>


<div class="pricetov">
    <div class="pricetovn"><h2><b>Заголовок товара</b></h2></div>
    <div class="pricetova">Артикул: <b>45466546</b></div>

    <div class="pricetovc">
      <div style="margin-top: 6px"></div>
      от <span><b>10.000</b></span><span> руб</span>
     <br/>
      <span>В наличии</span>
    </div>

    <a  href="" class="pricetovcorz tooltip" data-title="Добавить в корзину"><i class="fa fa-addcorz"></i></a>

    <a  href=""><div class="pricetovb anim">Смотреть</div></a>
</div>


</div>

CSS

.centerovka{
max-width: 800px;
min-width: 260px;
  margin: 50px auto;
  font-size: 14px;
}

.pricetov{
  border-radius: 3px;
  margin-bottom: 2px;
  background: #DADADA;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.pricetov > * {-ms-box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}

.pricetovn {
  width: 70%;
  min-width: 180px;
  padding: 0 20px 0 20px;
}
.pricetovn h2{
height: 50px;
  color: #39518b;
  font-size: 13px;
  font-weight: 400;
  line-height: 15px;
}
.pricetovn h2 b{
  font-weight: 400;
  height: 50px;
  display:table-cell;
  vertical-align:middle;
}
.pricetova {
  border-left: 1px solid #c7c7c7;
  min-width: 120px;
  height: 50px;
  line-height: 50px;
  color: #777;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
}
.pricetova b{
  color: #333;
  font-size: 13px;
  font-weight: 400;
}
.pricetovc {
  background: #c7c7c7;
  min-width: 180px;
  height: 50px;
  color: #000;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
}
.pricetovc b{
  color: #4D70C4;
  font-size: 14px;
  font-weight: 600;
}
.pricetovc b strong{
  color: #4D70C4;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
.pricetovc span{
  font-weight: 600;
}
.pricetovb {
  background: #818181;
  min-width: 95px;
  height: 50px;
  line-height: 50px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  text-transform: uppercase;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.pricetovb:hover{
  background: #F46B23;
  color: #fff;
}
.pricetovcorz {
  display: inline-block;
  float: left;
  background: #3D3D3D;
  width: 10%;
  min-width: 35px;
  height: 50px;
  line-height: 50px;
  text-align: center;
}
.pricetovcorz:hover{
  background: #F46B23;
  color: #fff;
}
.pricetovcorz:hover i{
  color: #fff;
}
.pricetovcorz.active{
  background: #F46B23;
  color: #fff;
  cursor: default;
}
.pricetovcorz.active i{
  color:...