JSFiddle - React, Tailwind, and code Playground
HTML
<div class="centre">
<div class="btn-group">
<button class="button">My first button</button>
<button class="button">My second button</button>
<button class="button">My third button</button>
</div>
</div>
CSS
html, body, .centre {
height: 100%;
width: 100%;
}
div.centre {
display: flex;
align-items: center;
justify-content: center;
}
.btn-group .button {
background-color: #4CAF50;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
font-size: 16px;
cursor: pointer;
float: left;
display: inline-block;
}
.btn-group .button:hover {
background-color: #3e8e41;
}