JSFiddle - React, Tailwind, and code Playground

HTML

<div class="banner-box">
  <a class="clearfix banner-box-banners" href="#" target="_self">
        <span class="yellow-ref">Корм</span>
  </a>
</div>

CSS

.banner-box {
  position: relative;  
  background-image: url(http://chloe.promo-z.ru/pictures/news/4431.png);
  height: 200px;
  display:flex;
  justify-content: center;
  align-items: center;
}

.yellow-ref{
  color: black;
  background: #FFD400;
  transform: translateX(64%);
  font-size: 22px;
  opacity: 0.8;
  padding: 13px;
  font-weight: bold;
  font-family: CirceExtraBold;
}

a {
  text-decoration:none;
}