JSFiddle - React, Tailwind, and code Playground

by Batteryacid

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div class="row myform">
    <div class="col-md-12">
        <form name="myform" role="form" novalidate>
            <div class="form-group">
                <label class="control-label" for="fullName">Address Line</label>
                <input required type="text" name="addr" id="addr" class="form-control" placeholder="Address" />
            </div>
            <div class="form-inline">
                <div class="form-group">
                    <label>State</label>
                    <input required type="text" name="state" id="state" class="form-control" placeholder="State" />
                </div>
                <div class="form-group has-feedback" show-errors='{ showSuccess: true }'>
                    <label>ZIP</label>
                    <input required type="text" name="zip" id="zip" class="form-control" placeholder="Zip" />
                </div>
            </div>
            <div class="form-group">
                <label class="control-label" for="country">Country</label>
                <input required type="text" name="country" id="country" class="form-control" placeholder="country" />
            </div>
        </form>
    </div>
    
</div>

CSS

.myform input.form-control {
    display: block;
    /* allows labels to sit on input when inline */
    margin-bottom: 15px;
    /* gives padding to bottom of inline inputs */
}