【问题标题】:What's wrong with this table formatting for IE 8?IE 8 的这个表格格式有什么问题?
【发布时间】:2017-01-17 00:15:13
【问题描述】:

此表(以下示例)由 XML 文件和 XSL 生成。

在本地加载 XML 时,它工作正常(从 127.0.0.1 开始):

当它从 LAN 上的另一台计算机或网络驱动器加载时,会发生这种情况:

我不知道为什么标题的位置会改变。真正让我恼火的是桌子上的双边框。在谷歌搜索 48 小时后,我一直无法找到有效的解决方案。我需要帮助!

这是表格 HTML:

<TABLE class=tablePrimaire>
    <TBODY>
        <TR>
            <TH rowSpan=2 scope=col>Période comptable</TH>
            <TH colSpan=6 scope=col>Informations Clé Comptable</TH>
            <TH colSpan=6 scope=col>Informations Mouvement Comptable</TH>
            <TH colSpan=3 scope=col>Informations Compte Comptable</TH>
        </TR>
        <TR>
            <TH scope=col>Code géographique</TH>
            <TH scope=col>Affectation</TH>
            <TH scope=col>Type garant</TH>
            <TH scope=col>Ligne ER</TH>
            <TH scope=col>Matricule</TH>
            <TH scope=col>Qui</TH>
            <TH scope=col>Montant non contrevalorisé</TH>
            <TH scope=col>Montant contrevalorisé</TH>
            <TH scope=col>Date de signature</TH>
            <TH scope=col>Date de mise en vigueur</TH>
            <TH scope=col>Devise d'enregistrement</TH>
            <TH scope=col>Origine</TH>
            <TH scope=col>Numéro de compte comptable</TH>
            <TH scope=col>Libellé numéro de compte comptable</TH>
            <TH scope=col>Sens</TH>
        </TR>
    </TBODY>
    <TBODY>
        <TR>
            <TD rowSpan=4>ll_pec193</TD>
        </TR>
        <TR>
            <TD>code_geo237</TD>
            <TD>affect238</TD>
            <TD>type_garant239</TD>
            <TD>ligne_er240</TD>
            <TD>matricule241</TD>
            <TD>qui242</TD>
            <TD>mnt_nn_ctrvalo84</TD>
            <TD>mnt_ctrvalo83</TD>
            <TD>date_sign85</TD>
            <TD>date_mis_vig86</TD>
            <TD>code_devise89</TD>
            <TD>origine89</TD>
            <TD>num_cpt_cmpt235</TD>
            <TD>ll_cmpt30</TD>
            <TD>sens_cpt32</TD>
        </TR>
        <TR>
            <TD>code_geo246</TD>
            <TD>affect247</TD>
            <TD>type_garant248</TD>
            <TD>ligne_er249</TD>
            <TD>matricule250</TD>
            <TD>qui251</TD>
            <TD>mnt_nn_ctrvalo85</TD>
            <TD>mnt_ctrvalo84</TD>
            <TD>date_sign86</TD>
            <TD>date_mis_vig87</TD>
            <TD>code_devise90</TD>
            <TD>origine90</TD>
            <TD>num_cpt_cmpt236</TD>
            <TD>ll_cmpt40</TD>
            <TD>sens_cpt42</TD>
        </TR>
            <TR>
                <TD>code_geo266</TD>
                <TD>affect267</TD>
                <TD>type_garant268</TD>
                <TD>ligne_er269</TD>
                <TD>matricule260</TD>
                <TD>qui261</TD>
                <TD>mnt_nn_ctrvalo94</TD>
                <TD>mnt_ctrvalo93</TD>
                <TD>date_sign95</TD>
                <TD>date_mis_vig96</TD>
                <TD>code_devise99</TD>
                <TD>origine91</TD>
                <TD>num_cpt_cmpt237</TD>
                <TD>ll_cmpt50</TD>
                <TD>sens_cpt52</TD>
            </TR>
    </TBODY>
    <TBODY>
        <TR>
            <TD rowSpan=2>ll_pec200</TD>
        </TR>
        <TR>
            <TD></TD>
            <TD></TD>
            <TD></TD>
            <TD></TD>
            <TD></TD>
            <TD></TD>
            <TD>mnt_nn_ctrvalo198</TD>
            <TD>mnt_ctrvalo112</TD>
            <TD>date_sign95</TD>
            <TD>date_mis_vig96</TD>
            <TD>code_devise99</TD>
            <TD>origine100</TD>
            <TD></TD>
            <TD></TD>
            <TD></TD>
        </TR>
    </TBODY>
    <TBODY>
        <TR>
            <TD rowSpan=2>ll_pec198</TD>
        </TR>
        <TR>
            <TD>code_geo245</TD>
            <TD>affect246</TD>
            <TD>type_garant247</TD>
            <TD>ligne_er248</TD>
            <TD>matricule249</TD>
            <TD>qui250</TD>
            <TD>mnt_nn_ctrvalo198</TD>
            <TD>mnt_ctrvalo93</TD>
            <TD>date_sign95</TD>
            <TD>date_mis_vig96</TD>
            <TD>code_devise99</TD>
            <TD>origine100</TD>
            <TD>num_cpt_cmpt244</TD>
            <TD>ll_cmpt40</TD>
            <TD>sens_cpt42</TD>
        </TR>
    </TBODY>
</TABLE>

这是 CSS:

.tablePrimaire
{
    border: 1px solid black;
    border-collapse: collapse;
    white-space: nowrap;
}

.tablePrimaire th
{
    border: 1px solid black;
    border-collapse: collapse;
    padding-left: 3px;
    padding-right: 3px;
    font-size: 0.7em;
    height: 30px;  
    background-color: #8c8b83;
    color: white;
    white-space: nowrap;
}

.tablePrimaire td
{
    width: 12.5%;
    height: 17px;
    vertical-align: middle;
    text-align: center;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 0.7em;
    border: 1px solid black;
}

tbody
{
    background: #f9f4e9;
}

tbody:nth-child(odd)
{
    background: #eee0c1;
}

tbody:hover td[rowspan], tr:hover td
{
    background: #d0e4f2; 
}

期待您的建议!

我应该提到它在 Firefox 中运行良好,无论是否在本地。

这是我第一次真正地使用 HTML 和 CSS,所以对于任何明显的错误和失误,我真的很抱歉。

【问题讨论】:

  • 如何删除所有css代码,然后再次检查。它可能会帮助您找出一些可能导致您问题的额外css设置。
  • 我已经这样做了,但无济于事。此图像:snag.gy/QZUKC.jpg 来自以下代码:.tablePrimaire { border: 1px solid black; } .tablePrimaire td { border: 1px solid black; } 您可以看到对齐差异以及双边框是如何产生的。同样,在本地访问时不会发生这种情况。
  • 您是否指定了文档类型?如果有,是什么?
  • XSL 中的输出行如下:&lt;xsl:output method="html" encoding="utf-8" doctype-public="-//W3C//XSD XHTML 1.0 Transitional//EN" doctype-system="http://www.w3.org/2001/XMLSchema.xsd"/&gt;
  • 这是上面的图片,但在本地:snag.gy/e6n3K.jpg 相同的 XML,相同的 CSS 在桌子上(上面的行)。当添加了其余样式时,这个可以工作。

标签: html css internet-explorer html-table


【解决方案1】:

我怀疑您被 IE 的兼容性行为所吸引。如果您在域中,默认情况下,本地网络上的任何服务器(无论是否在域中)都被视为 Intranet 区域:http://blogs.msdn.com/b/ie/archive/2005/12/07/501075.aspx

并且在 Intranet Zone 中,默认情况下,所有页面都选择“Emulate IE7 'standards'”模式:http://www.nathanfox.net/blog/63/Internet-Explorer-8-compatibility-view-and-the-local-intranet-zone

要解决这个问题,请使用 X-UA-Compatible HTTP 标头,或作为 &lt;meta&gt; 标记(尽管它不会在 W3C 验证器中验证)。有关 IE 8 完整行为的详细信息,请参阅 Activating Browser Modes with Doctype

【讨论】:

  • 你是一个了不起的人。谢谢!并诅咒 IE。
  • 我所要做的就是将这个添加到&lt;head&gt;标签:&lt;meta http-equiv="X-UA-Compatible" content="IE=8"/&gt;
  • 我也强烈推荐这个单行器来加速 IE:code.google.com/p/ie7-js
【解决方案2】:

您在第 25 行缺少 &gt;。它应该是 &lt;/TR&gt; 而不是 &lt;/TR

【讨论】:

  • 对不起,这是我的错误,它不在实际代码中。已更正。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-06-30
  • 2011-04-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多