JSFiddle - React, Tailwind, and code Playground

by ken3desu

HTML

<h2>同じnameなのに複数チェックされるラジオボタン</h2>
<div class="border">
  <form>
    <div>
      <input type="radio" id="huey" name="drone" value="huey">
      <label for="huey">Huey</label>
    </div>
  </form>
  <form>
    <div>
      <input type="radio" id="dewey" name="drone" value="dewey">
      <label for="dewey">Dewey</label>
    </div>
  </form>
</div>
<h2>正常動作</h2>
<div class="border">
  <form>
    <div>
      <input type="radio" id="huey2" name="drone" value="huey">
      <label for="huey2">Huey</label>
    </div>
    <div>
      <input type="radio" id="dewey2" name="drone" value="dewey">
      <label for="dewey2">Dewey</label>
    </div>
  </form>
</div>

CSS

.border {
  border: solid
}