JSFiddle - React, Tailwind, and code Playground

HTML

<label>
    <input type="radio" name="button">
        Left
 </label>
 <label>
     <input type="radio" name="button">
         Middle
 </label>
 <label>
     <input type="radio" name="button">
     Right
 </label>

CSS

label {
    display:inline-block;
    border:1px solid;
    padding:10px;
    margin-right:-5px;
}
label:hover{
    background-color: #e6e6e6;
}
label:first-child{
    border-top-left-radius:5px;
    border-bottom-left-radius:5px;
}
label:last-child{
    border-top-right-radius:5px;
    border-bottom-right-radius:5px;
}
input[type=radio]{
    display:none;
}
label input:checked{
    background-color:#e6e6e6;
}