JSFiddle - React, Tailwind, and code Playground

HTML

<div id = "rect0">

    <div class = "banner grid_18" href="about.html"></div>
    <a href="logic.html"  class="button" id ="new">View Article</a>

    <div class=" grid_8 callout"></div>
    <a href="gallery.html"  class="button" id ="new1">View Gallery</a>

</div>

CSS

#rect0{
position: relative;
margin-top: -10px;
margin-left: 0px;
    width: 951px;
height: 270px;
padding-left: 4px;
padding-top: 1px;
background: #ffffff;
z-index: 0;
}

.button{
background: #242324;
color: #B7B7B7;
padding: 6px;
color: white;
font-size: 11px;
text-transform: uppercase;
 }

.button:hover{color: #d2d2d2;}

  #new{
position: absolute;
margin-left: -140px;
margin-top: 220px;
  }

  #new1{
position: absolute;
margin-left: 117px;
margin-top: 220px;

  }