JSFiddle - React, Tailwind, and code Playground

by alexhram

HTML

<div class="right">
    <form id="updateProfile">
        <fieldset class="checkboxes">
            <p>4. What is your favorite type of vacation?</p>
            <label><input type="checkbox" name="vacation" value="Ski Trips"> Ski Trips</label>
            <label><input type="checkbox" name="vacation" value="Beach Visits"> Beach Visits</label>
            <label><input type="checkbox" name="vacation" value="Cruises"> Cruises</label>
                <label><input type="checkbox" name="vacation" value="Historical and educational trips"> Historical and educational <span class="antiWrap">trips</span></label>
            <label><input type="checkbox" name="vacation" value="Yachting"> Yachting</label>
            <label><input type="checkbox" name="vacation" value="Road Trip"> Road Trip</label>
            <label><input type="checkbox" name="vacation" value="Spa Weekend"> Spa Weekend</label>
            <label><input type="checkbox" name="vacation" value="Bed and Breakfast"> Bed and Breakfast</label>
            <label><input type="checkbox" name="vacation" value="Stay home and relax"> Stay home and relax</label>
            <label><input type="checkbox" name="vacation" value="Gambling Trips"> Gambling Trips</label>
            <label><input type="checkbox" name="vacation" value="Volunteer"> Volunteer</label>
        </fieldset>
    </form>
</div>

CSS

div.right{width:598px;}

form#updateProfile fieldset label{
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
    float: left;
    width: 33%;
}
.antiWrap { margin-left: 18px; }