JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<form class="form-inline">
    <div class="form-group">
        <label class="sr-only"></label>
        <input class="form-control" type="text"/>
    </div>               
    <div class="checkbox">
        <label>
            <input type="checkbox"/> Test
        </label>
    </div>
    <div class="checkbox">
        <label>
            <input type="checkbox"/> Test againn
        </label>
    </div>
    <div class="checkbox">
        <label>
            <input type="checkbox"/> Hello World Here I am
        </label>
    </div>
</form>

<hr>
    
    <form class="form-horizontal">
        <div class="form-group">
            <label class="sr-only"></label>
            <input class="form-control" type="text"/>
        </div>               
        <div class="checkbox">
            <label>
                <input type="checkbox"/> Test
            </label>
        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox"/> Test againn
            </label>
        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox"/> Hello World Here I am
            </label>
        </div>
    </form>

CSS

@media (min-width: 768px) {
    .form-inline .radio input[type="radio"], 
    .form-inline .checkbox input[type="checkbox"] {
        float: left;
        margin-right: 5px;
        margin-left: 5px;
    }
}