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

做用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>
相关推荐
Allen Bright2 小时前
【CSS-15】深入理解CSS transition-duration:掌握过渡动画的时长控制
前端·css
一天睡25小时2 小时前
一款减轻前端图片命名工作量的图片转换器
前端·javascript·html
梅纳德3 小时前
如何发现一个网站的全部页面?7种方法
html
一只小风华~5 小时前
Web前端开发: :has功能性伪类选择器
前端·html·html5·web
天天扭码16 小时前
《很全面的前端面试题》——HTML篇
前端·面试·html
到底起什么网名才能不重名18 小时前
使用各种CSS美化网页
前端·css·vscode·bootstrap·html
sunbyte19 小时前
50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ContentPlaceholder(背景占位)
前端·javascript·css·vue.js·tailwindcss
码哥DFS1 天前
Flex布局原理
前端·css·css3
小飞悟1 天前
别再只会用 px 了!移动端适配必须掌握的 CSS 单位
前端·css·设计
默默地离开1 天前
Blob二进制处理的王者
前端·javascript·html