html - 如何将复选框彼此水平对齐

Question

快速提问，我想知道是否可以将我的 3 个复选框和段落水平对齐，而不是像现在那样垂直对齐

谢谢你的帮助

	<div class="wrapper3">
	<p>Do You Want Sound ?</p>
	<input type="checkbox" value="No" style="color: Black;" id="sound">Yes
    <p>Do You want Flashes ?</p>
    <input type="checkbox" value="No" style="color: Black;" id="flash">Yes
    <p>Do You want Text ?</p>
    <input type="checkbox" value="No" style="color: Black;" id="text">Yes
    <br />
	</div>

Answer 1

您可以通过将段落和复选框包装在 <div> 中轻松实现这一点随着更改 display你的属性(property)<p>标记为 inline-block .这是一个演示:

p {
  display: inline-block;
}

<div class="wrapper3">
  <div>
    <p>Do You Want Sound ?</p>
    <input type="checkbox" value="No" style="color: Black;" id="sound">Yes</div>
  <div>
    <p>Do You want Flashes ?</p>
    <input type="checkbox" value="No" style="color: Black;" id="flash">Yes</div>
  <div>
    <p>Do You want Text ?</p>
    <input type="checkbox" value="No" style="color: Black;" id="text">Yes</div>
  <br />
</div>