试图获取一个asp复选框以在IE中的表中对齐

Question

我查看了其他类似的条目，但未找到解决方案。

我有一个asp复选框，由后面的代码生成。它生成的html是：

<span class="covered">
    <label for="">Multi</label>
    <input type="checkbox">
</span>

这包含在表格单元格中：

<td>
    <input class="cniid" type="hidden" value="3375" name="">
    <input class="accid" type="hidden" value="759880" name="">
    <span class="covered">
        <label for="">Multi</label>
        <input type="checkbox">
    </span>
</td>

在Firefox中，这很好用：

然而在IE中，它未对齐：

如何解决此问题，并使IE版本像FF版本一样工作？

我没有包含css，因为没有相关性 - td周围的样式如下：

.displaytable {font-size: smaller;}
body {color: #7B0343;font-family: "Tahoma","Lucida Grande","Segoe UI",Arial,Helvetica,Verdana,sans-serif;font-size: 14px;font-weight: bold;}

在这种情况下，类更多地用于js代码而不是样式。

添加了显示此内容的js fiddle。我将继续努力将这个代码减少到仍然产生问题的程度。所以还有更多，但我试图包括我需要的东西。

Answer 1

**问题编辑后更新** 看着小提琴我只能在IE7及更低版本上重现这个问题。 IE7和显示CSS有几个问题，例如参见this SO question。

这个答案实际上似乎也适用于您的代码。我已经分叉你的小提琴并更新了CSS，这样它也可以在IE7中运行。 This is the jsfiddle。简而言之，我用以下内容替换了所有的CSS：

.covered input {
    float: right;
    display: inline-block; 
    zoom: 1;
    *display: inline; 
}
.covered label {  float: left; }

原始回答：

我已将您的代码粘贴到this jsfiddle中，在IE9和FF中看起来与我相同。一些可能是问题的事情：

• IE正在缓存某些内容（可能是css），点击ctrl + f5或使用F12将其设置为始终刷新
• 您正在使用显示此行为的其他IE版本（如果您点击F12，您有哪些模式）
• CSS（我猜的很可能是源代码）

如果确实是CSS尝试：

• 使用span / label / input的display属性以及这些元素的宽度
• 在IE中点击F12，选择TD中的元素，并检查它们上的样式以查看发生了什么
• 当时从您的网站上剥离一件，直到找到负责的代码
• 设置span { border: 1px solid fuchsia; }，dito用于输入，标签等

如果所有这些都没有帮助，请尝试制作一个显示此问题的jsfiddle并将其链接到您的问题中。

Answer 2

终于找到了解决方案 - 谢谢那些贡献者。问题是一个流氓浮动：正确的输入。在Firefox中，这非常有效，并且将盒子浮动到单元格的右侧。然而在IE中，它通过将输入浮动到另一条线上的右边来引起奇怪的现象。

我通过覆盖浮点数并包含一些填充来包含在我的IE特定的css文件中解决了这个问题。这个问题是，当文本长度不一样时，框不会排成一行，这就是我想把它们放在右边的原因。但这必须要做。

让我不得不做这些IE小提琴，因为主浏览器不会以相同甚至等效的方式解释代码。