HTML/CSS表格右对齐文本在IE中无效

Question

再次遇到了 Internet Explorer 给我制造麻烦的情况。我有一个表格，在同一行中有两个单元格。我想将一些文本左对齐显示（第一个单元格），另一个文本右对齐显示（第二个单元格）。在 Chrome 和 Firefox 中完全正常，但是在 IE 中所有文本都左对齐：

<table width="660px">
<tr>
    <td align="left" width="160px">Text 1</td>
    <td align="right" width="160px">Text 2</td>
</tr>

经过一些研究，我想知道是否应该将其放在CSS上，所以我将其更改为：

HTML：

<table class="anchors" width="660px">
<tr>
    <td class="left" width="160px">Text 1</td>
    <td class="right" width="160px">Text 2</td>
</tr>

CSS:

table.anchors td.left
{
    text-align: left;
}

table.anchors td.right
{
      text-align: right;
}

在IE浏览器中仍然无法正常工作（至少在版本9中如此）。有没有人对此有什么提示？我应该使用其他东西（比如div）吗？

- João Fernandes

---

该页面显示影响IE 6和7，但OP已经说明是IE 9。 - Clyde Lobo

你的网页里有 doctype 吗？ - Clyde Lobo

谢谢大家的快速和友好的回答。问题很明显：就像你们中的许多人指出的那样，td的宽度。我每个<td>都有330个像素，不知何故改变了它，没有注意到。对不起打扰你了。虽然我已经更改了一些细节以获得更标准化的HTML，但我将检查HTML的有效性，因为其中一部分是由我使用的软件（SSI Web）生成的。 - João Fernandes

这是另一回事，Prash。有关详细信息，请参阅我对原帖的评论。不过还是谢谢！ - João Fernandes

对不起，jaff，你是正确的，我没有完全阅读你的问题。 - Prashobh

Answer 1

代码在语法上存在问题（width属性应采用数字或百分比值，而不是像px这样的单位），尽管浏览器会原谅此错误。更严重的是，您设置了冲突要求：表格应该有660像素宽度，但由两个160像素宽的单元格组成。不足为奇，浏览器的行为是不一致的。

然而，当IE 8和IE 9处于“标准模式”时，它们的行为与其他浏览器相同。否则，在怪异模式中，任何事情都可能发生，并且您不能将其称为错误，因为文档不符合规范。因此，请添加适当的文档类型声明。

此外，最好避免冲突要求。如果您需要以像素为单位设置表格的总宽度，则可以这样做。然后，设置列宽度使它们相加，或者更简单的方法是将宽度设置为50%（对于一个需要平衡的双列表格）。

- Jukka K. Korpela

---

你是对的，Jukka。看一下我上面原始帖子的评论。非常感谢大家的纠正！ - João Fernandes

Answer 2

http://jsfiddle.net/6jvnQ/

您能否将表格的宽度更改为与两个单元格一样宽？我怀疑由于奇怪的宽度而导致结果不同。

- Jonas G. Drange

---

就是这样，乔纳斯。请查看我对自己的帖子的回复以获取详细信息。谢谢！ - João Fernandes

Answer 3

请使用以下代码：

padding-left:22% 或 22px 或任何长度

- vks