JSFiddle - React, Tailwind, and code Playground
by Mr Api
HTML
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<style>
.btn-outline {
background-color: transparent;
color: inherit;
transition: all .5s;
}
.btn-wrap-text {
white-space: normal !important;
word-wrap: break-word !important;
}
</style>
<div class="container">
<div class="row">
<div class="col-sm-6">
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE
</button>
</div>
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE
</button>
</div>
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE WITH LONGER NAME
</button>
</div>
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE
</button>
</div>
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE
</button>
</div>
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE
</button>
</div>
<div class="col-sm-4 col-md-4">
<button class="btn btn-success btn-sm btn-block btn-outline">
ARTICLE WITH LONGER NAME
</button>
</div>
<div class="col-sm-4 col-md-4">
<button...