将宽度为100％且没有标签的复选框对齐到左侧

Question

我想使用左侧宽度为容器100％的复选框，但找不到解决方案。

那是我的HTML代码：

.checkboxes {
  border: 1px solid #000;
  width: 400px;
}

input[type=checkbox] {
  display: block;
  text-align: left;
  margin: 0 auto;
  width: 100%;
}

<div class="checkboxes">
  <input type="checkbox" id="scales" name="scales">
  <input type="checkbox" id="horns" name="horns">
</div>

Answer 1

从margin: 0 auto; width: 100%;中删除input[type="checkbox"]。在侧面具有自动位置，可将框置于中间。

具有显示块将确保它位于单独的行上