JSFiddle - React, Tailwind, and code Playground
by cent cent
HTML
<div class="prevNext">
<a class="prev" href="#">Previous Article</a>
<a class="next" href="#">Next Article</a>
</div>
<div class="prevNext2">
<a class="prev" href="#">Previous Article</a><a class="next" href="#">Next Article</a>
</div>
CSS
body {
margin: 10px;
}
.prevNext {
text-align: justify;
border: 1px solid #ccc;
line-height: 0;
}
.prevNext a {
display: inline-block;
line-height: 1.2;
}
.prevNext:after {
content: '';
display: inline-block;
width: 100%;
vertical-align: top;
}
.prevNext2 {
text-align: justify;
border: 1px solid #ccc;
}
.prevNext2 a {
display: inline-block;
position: relative;
top: 1em;
}
.prevNext2:after {
content: '';
display: inline-block;
width: 100%;
}
.prevNext2:before{
content: '';
display: block;
width: 100%;
margin-bottom: -1em; /* your line-height */
}