html checkbox和label 文字不对齐解决办法

天天打码2024-11-06 15:09

做用html或bootstrap时，表单元素和文字不对齐现实，不管用什么vertical-align:middle，也无法解决。

先看现象：

html 复制代码

<input type="radio" id="agreed" name="Appeal" value="Agreed" class="form-control radioAppeal"> <label for="agreed" style="margin-right: 20px;">同意</label> 

<input type="radio" id="rejected" name="Appeal" value="Rejected" class="form-control radioAppeal"> <label for="rejected">不同意</label>

解决办法：

csss 复制代码

.flex{display:flex; align-items:center;}

bash 复制代码

<div class="flex">
	<input type="radio" id="agreed" name="Appeal" value="Agreed" class="form-control radioAppeal"> <label for="agreed" style="margin-right: 20px;">同意</label> 
	<input type="radio" id="rejected" name="Appeal" value="Rejected" class="form-control radioAppeal"> <label for="rejected">不同意</label>
</div>