时间戳

首页 > 解决方案 > 问题将复选框和文本内联

css - 问题将复选框和文本内联

问题描述

是否有可能以某种方式使复选框和文本内联？遇到这个问题，通过css尝试了内联选项，但似乎我要么不能使用它，要么它不起作用。

标签： csswordpressinline

解决方案

这是一个简单的例子。您只需要一个包装元素和一行CSS. 默认情况下，所有直接 flex 子节点将共享行上可用的水平空间。

.checkboxRow {
  display: flex;
}
<div class="checkboxRow">
  <input id="mycheckbox" type="checkbox">
  <label for="mycheckbox">I am a label</label>
</div>

<div class="checkboxRow">
  <input id="mycheckbox2" type="checkbox">
  <label for="mycheckbox2">I am a label</label>
</div>

推荐阅读