JSFiddle - React, Tailwind, and code Playground

HTML

<fieldset class="lefty" id="garden">
  <legend>legend</legend>
  <ul class="opts_labels">
    <li>
      <label for="apples"> apples </label>
    </li>
    <li>
      <label for="lemons"> lemons </label>
    </li>
    <li>
      <label for="strawberries"> strawberries </label>
    </li>
  </ul>
  <ul class="opts_inputs">
    <li>
      <select name="apples" id="apples">
        <option value=""> </option>
        <option value="selling">selling</option>
        <option value="making">making</option>
        <option value="both">both</option>
      </select>
    </li>
    <li>
      <select name="lemons" id="lemons">
        <option value=""> </option>
        <option value="selling">selling</option>
        <option value="making">making</option>
        <option value="both">both</option>
      </select>
    </li>
    <li>
      <select name="strawberries" id="strawberries">
        <option value=""> </option>
        <option value="selling">selling</option>
        <option value="making">making</option>
        <option value="both">both</option>
      </select>
    </li>
  </ul>
</fieldset>

CSS

ul {
          list-style: none;
        }

        ul.opts_labels {
          float: left;
          padding: 0 5px;
          width: 120px;
        }

        ul.opts_inputs {
          float: right;
          padding: 0 5px;
        }

        .lefty {
          float: left;
        }

        .righty {
          float: right;
        }

        .clear_float {
          clear: both;
        }