JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div class="product_card">
<div>
  <img class="image" src="http://placehold.it/280x198/cc0" alt="Lowe">
 </div>
 <div class="text">
<span>НАЗВАНИЕ</span>
</div>
  
  
</div>
  
  
</body>

CSS

body{
  margin: 0;
  padding: 0;
  color: #fff;
}
img{
  display:block;
  width:100%;
  height:100%;
}


.product_card{
  position: relatie;
  width: 280px;
  height: 198px;
  background: #333;
  float: left;
}

.price{
   position:absolute;
   bottom:0;
   font-size: 40px;
   color: #fff;
   margin-left: 10px;
}
.text{
  text-align: left;
  font-size: 40px;
  font-family: Tahoma, sans-serif;
  position: relative;
  z-index:10;
  position: absolute;
  top:20px;
  left:20px;
}