css - 奇怪的 IE8 css 问题

Question

我有一个具有以下结构的标题行:

<th...
  <a...
   <span...
     {text}

如果您查看附件，您会注意到所有具有此结构的标题都是对齐的。

好吧，当一个特定的标题被点击为“已排序”状态时，结构将是这样的:

<th...
  <a...
   <span...
     <table>
        <tbody>
           <tr>
              <td>
                {text}
              </td>
              <td>
                 <div> //with a background image
              </td>
           </tr>
        </tbody>
     </table>

好吧，在 IE8 中，这个排好序的列不再对齐(请看截图)。

我已经尝试了很多将一些 css 样式(position:relative等)添加到跨度内的表格以修复 IE8 中的对齐但我失败了..

这里有任何 CSS 大师可以提出修复建议吗？

请注意，我无法更改此结构(它是从 ICEfaces 库生成的一些代码)，但我可以应用 css 属性(如果我知道在哪里...)。

此外，应用的排序列没有 css 差异(某些特定的重要样式)。只是那个跨度内的普通表格。

谢谢。

Answer 1

检查 vertical-align 属性，也许。在这里，从屏幕截图来看，它似乎处于默认模式“基线”。 (不过我不确定它会有多大作用)

尝试: th.stuff { 垂直对齐:顶部； }或者 : th.stuff { 垂直对齐:中间； }

您还可以使所有 th 稍微高一点，并获得一些填充以对齐内容。我觉得问题，总的来说；来自表中第 th 个中出现的选择。