JSFiddle - React, Tailwind, and code Playground

HTML

<div class="bg-img">
    <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=300">
  <div class="colored-box">
      <h3> 04 <br> SEPT </h3>
  </div>
        </div>

CSS

.colored-box{
    background-color:blue;
    padding:10px 20px 10px 20px;
    margin-left:10px;
    position:absolute;
    bottom:150px;
    text-align:center;
}