JSFiddle - React, Tailwind, and code Playground

by Michaël Vanbrabandt

HTML

<div class="small-3 small-centered text-left columns">
    <div class="col">
      <input type="radio" name="lt_mc_ans" value="1" id="lt_mc_ans_1"><span> 1. </span>
      <label for="lt_mc_ans_1">I</label>
    </div>
    <div class="col">
      <input type="radio" name="lt_mc_ans" value="2" id="lt_mc_ans_2"><span> 2. </span>
      <label for="lt_mc_ans_2">rsr rs rsrs rsrs r rrrssr rs rsrs rsrs r rrrs</label>
    </div>
    <div class="col">    
      <input type="radio" name="lt_mc_ans" value="3" id="lt_mc_ans_3"><span> 3. </span>
      <label for="lt_mc_ans_3">Very</label>
    </div>
    <div class="col">
      <input type="radio" name="lt_mc_ans" value="4" id="lt_mc_ans_4"><span> 4. </span>
      <label for="lt_mc_ans_4">She</label>
    </div>
</div>

CSS

.small-centered {
  margin-top: 15px;
  margin-bottom: 15px;
  width: 296px;
  background-color: red;
}

.col {
    clear: both;
}

input, span, label {
  float: left;
}

label {
  white-space: normal;
  display: inline-block;
  margin-left: 20px;
}

.text-left {
  text-align: left !important;
}