JSFiddle - React, Tailwind, and code Playground

HTML

<div style="border:solid 1px red;padding:4px;">
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">ab</div>
    <div class="a">Need space on top</div>
    <div class="a">My top border overlapped the div above me</div>
</div>

CSS

.a{
    border:solid 1px black;
    display:inline-block;
    margin-bottom: 1px;
    zoom: 1;
    *display: inline
}