JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="products">
        <li class="last"><a href="product.html" class="image"><img src="images/img3.jpg" border="0" alt="image" /></a>
          <h3 class="name"><a href="product.html">Product Name</a></h3>
          <div class="price">123.000 €</div>
            <p class="new">NEW!</p> <!-- Added This -->
        </li>
        <li class="last"><a href="product.html" class="image"><img src="images/img7.jpg" border="0" alt="image" /></a>
          <h3 class="name"><a href="product.html">Product Name</a></h3>
          <div class="price">123.000 €</div>
        </li>
      </ul>

CSS

ul.products li .image {
    display:block;
    background:#fefefe;
    border:1px solid #e3e3e3;
    width:308px;
    height:202px;
    margin:0 0 10px 0;
    text-align:center;
}
ul.products li .name {
    font-size:24px;
    padding:0 0 5px 0;
}
ul.products li .name a {
    text-decoration:none;
    color:#666666;
}
ul.products li .name a:hover {
    color:#999999;
}
ul.products li {
    float:left;
    margin:0 42px 29px 0;
    display:block;
    position: relative; /* ADDED THIS */
}
ul.products li .price {
    font-size:13px;
    color:#003399;
}
ul.products li.last {/*MOD*/
    margin-right:0;
}
ul.products li p.new { /* ADDED THIS */
    position: absolute;
    top: 3px;
    right: 3px;
    margin: 0;
    /* below is just for style, doesn't matter for actual function */
    border: 1px solid #00D;
    border-radius: 8px;
    padding: 3px 6px;
    background-color: #44C;
    color: #FFF;
}