我有这个 html 代码，我想在它的范围内垂直对齐复选框:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>asdad</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="inner_css/account.css" rel="stylesheet" type="text/css" />
</head>
<body class="xxx">
<div class="fieldWrapper">
<span class="fieldHeader">C++</span>
<span class="checkboxOfField"><input style="text-align:center; vertical-align:middle" type="checkbox"></span>
<div class="fildtablewrapper">
<table>
<tr>
<td>
0-2
</td>
<td>
2-5
</td>
<td>
5 ומעלה
</td>
</tr>
<tr>
<td>
<input type="radio" name="xxx" value="1">
</td>
<td>
<input type="radio" name="xxx" value="2">
</td>
<td>
<input type="radio" name="xxx" value="3">
</td>
</tr>
</table>
</div>
</div>
</body>
</html>
和这个CSS代码:
.xxx{
direction: rtl;
text-align: center;
}
.fieldWrapper{
display: inline-block;
width: 140px;
background-color: yellow;
text-align: center;
}
.fieldHeader{
display: inline-block;
width: 100%;
direction: ltr;
text-align: center;
}
.checkboxOfField{
display: inline-block;
width: 100%;
background-color: red;
height: 40px;
}
.fildtablewrapper{
display: inline-block;
width: 100%;
text-align: center;
}
table{
width: 100%;
}
td{
width: 33.33%;
}
而且我仍然无法垂直对齐复选框，我搜索了我们但找不到适合我的东西。 请帮助!
最佳答案
将此添加到您的 .checkboxOfField 样式中:
行高:40px;
这将使复选框以跨度的 40 像素高度为中心
关于html - 复选框垂直对齐，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12590136/