Bootstrap“折叠”按钮内的输入复选框在FF中不起作用

Question

尝试在Bootstrap的Collapse组件中获取输入复选框。该复选框适用于Chrome / Safari。但它似乎被按钮标签覆盖了。

Link to screenshot

<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
  <div class="form-check">
    <input class="form-check-input" type="checkbox" value="" id="defaultCheck1">
    <span class="button-label">Button Label 1</span>
    <div class="exp-status">
      <i class="fas fa-plus"></i>
    </div>
  </div>
</button>

Answer 1

我在经过一些研究后意识到，在按钮标记内放置一个输入标记是无效的标记。所以我将按钮更改为div并应用了适当的样式。现在适用于所有浏览器。