Firefox和IE8之间的另一个区别 - viewPanel列不会显示相同

Question

如果你创建一个viewPanel并且其中一个列包装多行（请参阅下面的代码以了解我如何包装列），所有其他列将文本移动到行的底部等于包装的底部柱。在FF和Chrome中，这些列位于顶部。 他们希望他们在IE的顶部。

在我正在进行包装的专栏中，我使用以下公式，我想知道这是否有所作为

<xp:viewColumn id="viewColumn4"
      contentType="HTML" width="150px">
     <xp:this.value><![CDATA[#{javascript:var valArr1 = new Array(view1.getColumnValue("SourceFileName"));
     valArr1.join('<br/>')}]]></xp:this.value>
     <xp:viewColumnHeader id="viewColumnHeader4"
          value="Original File Name">
     </xp:viewColumnHeader>
</xp:viewColumn>

第一个屏幕截图显示了Firefox中的viewPanel，其中的列排列在单元格的顶部。第二个屏幕截图显示了IE8中完全相同的视图以及在单元格底部排列的列。

我可以在代码/ css中更改哪些内容，使列在IE8中排在最前面？

Answer 1

默认情况下，我的viewPanels不会这样做，所以我想知道是否存在导致问题的现有CSS？

使用IE开发人员工具 - SHIFT-F12并检查样式。尝试更改它，直到您可以在页面上工作。

那说这是一个开始的建议 假设您的viewPanel名为ViewPanel1

TABLE[id$='viewPanel1'] TR TD 
{
    display: block;
    vertical-align: top
} 

Answer 2

您应该考虑使用CSS重置。 CSS重置会将所有元素的样式重置（设置）为基线值，以避免由于其内置的默认样式设置而导致的跨浏览器差异。通过重置样式，您可以避免默认使用浏览器的内置样式，这种样式因浏览器而异。

CSSReset.com包含最常见的CSS重置脚本。

您当然可以将CSS重置为您特定网站所需的默认值（例如，以符合您对表格单元格的垂直对齐的要求）。

一旦应用了CSS重置，您就可以使用自己的CSS样式（并希望避免不一致，例如您在此处遇到的内容）。