面对 IE8 和 Firefox 的复选框文本对齐问题答案

【问题标题】：Facing IE8 and Firefox Alignment issue of the text of a checkbox面对 IE8 和 Firefox 的复选框文本对齐问题
【发布时间】：2012-10-25 14:24:20
【问题描述】：

我以下列方式使用复选框。 Firefox 中的屏幕截图

IE8中的截图在这里

这里是代码

<div>
   <div>Testing :</div>
   <div><input type="checkbox" value="1"/> One</div>
   <div><input type="checkbox" value="2"/> Two</div>
   <div><input type="checkbox" value="3"/> Three</div>
</div>

如何在两个浏览器中垂直居中对齐文本？

【问题讨论】：

标签： html css checkbox internet-explorer-8 text-alignment

【解决方案1】：

在你的 CSS 中写下这个 -

input[type="checkbox"]{
    vertical-align: middle;
}

Working Demo

内联 CSS 技巧适用于 WIN XP。试一试——

<div><input type="checkbox" value="1" style="vertical-align: middle;" /> One</div>

【讨论】：

它不工作。即使在演示中，它看起来也不是中心垂直
我在 windows xp 上并在 IE8 和 firefox 上检查它，它不在中间 :(
我也试过了......即使在演示中，它仍然与屏幕截图中的相同
@Coder_sLaY 这是您的解决方案 - stackoverflow.com/questions/306252/…

【解决方案2】：

尝试使用不同的 css ：

<!--[if IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8.css">
<![endif]-->

在这个文件中为复选框编写你自己的css for ie 8

【讨论】：