JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="form-group">
    <label>
        <legend class="sq-form-question-title">Writing a list of random sentences is harder than I initially thought it would be.</legend>
    </label>
    <ul>
        <li>
            <input type="radio" name="q129957:q17" id="q129957_q17_0" value="0" class="sq-form-field" />
            <label for="q129957_q17_0">Joe made the sugar cookies; Susan decorated them.
</label>
        </li>
        <li>
            <input type="radio" name="q129957:q17" id="q129957_q17_1" value="1" class="sq-form-field" />
            <label for="q129957_q17_1">Sixty-Four comes asking for bread.
</label>
        </li>
        <li>
            <input type="radio" name="q129957:q17" id="q129957_q17_2" value="2" class="sq-form-field" />
            <label for="q129957_q17_2">Where do random thoughts come from?</label>
        </li>
        <li>
            <input type="radio" name="q129957:q17" id="q129957_q17_3" value="3" class="sq-form-field" />
            <label for="q129957_q17_3">The memory we used to share is no longer coherent.</label>
        </li>
        <li>
            <input type="radio" name="q129957:q17" id="q129957_q17_4" value="4" class="sq-form-field" />
            <label for="q129957_q17_4">She did her best to help him.</label>
        </li>
        <li>
            <input type="radio" name="q129957:q17" id="q129957_q17_5" value="5" class="sq-form-field" />
            <label for="q129957_q17_5">The waves were crashing on the shore; it was a lovely sight.</label>
        </li>
    </ul>
</div>

CSS

.form-group { width: 300px; }

label { margin-bottom: 25px; }

/* label { display: inline; } */