使用 Firefox 查看时网页中出现奇怪的中断答案

【问题标题】：Strange break appearing in Web page when viewed with Firefox使用 Firefox 查看时网页中出现奇怪的中断
【发布时间】：2013-10-17 06:45:57
【问题描述】：

我有一个网页，http://www.chiaramail.com/intro.html，它在 Chrome、IE 和 Safari 中显示良好，但在 Firefox 中查看时，彩色区域被水平白线分割。我怀疑这是与我使用表格的方式有关的空白，但我看不出 Firefox 不喜欢什么。

这是页面的相关HTML：

              <table class="content" Rules="none" FRAME=void>
                  <tbody>
                      <tr>
                          <td style="background-color: #97BBDD"></td>
                          <td><b style="color:green"><center>Ensure the privacy of your mail.</center></b></td>
                      </tr>
                      <tr>
                          <td style="background-color: #97BBDD"></td>
                          <td class="content content-data">Using <a href="technology.html">Envelope-Content Splitting</a><sup><font size="1">&#153;</font></sup> (ECS) technology, your e-mail becomes unreadable by everyone except your intended recipients. <a href="learn_more_privacy.html">Learn more</a>...</td>
                      </tr>
                      <tr>
                          <td class="content-data" align="center"><b style="color:green"><center>Keep control of every message you send. Forever.</center></b></td>
                          <td style="background-color: #BBDD97"></td>
                      </tr>
                      <tr>
                          <td class="content content-data">Change your message at any time after you sent it. Delete it. Even make it disappear seconds after your recipients have read it. <a href="learn_more_edit.html">Learn more</a>...</td>
                          <td style="background-color: #BBDD97"></td>
                      </tr>
                      <tr>
                          <td style="background-color: #DD97BB"></td>
                          <td><b style="color:green"><center>Protect your recipients from spoofing and phishing.</center></b></td>
                      </tr>
                      <tr>
                          <td style="background-color: #DD97BB"></td>
                          <td class="content content-data">ECS mail makes it virtually impossible for a sender to masquerade as you, due to the authentication scheme used by the ChiaraMail content server. <a href="learn_more_protect.html">Learn more</a>...</td>
                      </tr>
                      <tr>
                          <td class="content-data" align="center"><b style="color:green"><center>Send really big attachments more efficiently.</center></b></td>
                          <td style="background-color: #97DDBB"></td>
                      </tr>
                      <tr>
                          <td class="content content-data">ECS technology gives you the ability to send attachments of almost unlimited size, without maxing out your recipients' inboxes. <a href="learn_more_lg_attachments.html">Learn more</a>...</td>
                          <td style="background-color: #97DDBB"></td>
                      </tr>
                  </tbody>
              </table>

这里是 CSS：

    p {margin: 1em; }
    a.header { text-decoration:none; }
    a.footer { text-decoration:underline; }
    table.header { border: none; }
    table.footer { border: none; width:60%; }
    table.content { border: none; width:60%; margin-left: auto; margin-right: auto;}
    td.header-img { border: none; }
    td.header { padding:10px; background-color: #808080; }
    td.footer { padding:10px; background-color: #f2f2f2; }
    td.content { padding:10px; text-align: left; }
    td.header:hover { background-color: #94B9DC; }
    td.footer:hover { background-color: #f2f2f2; }
    td.content-img:hover { background-color: #97BBDD; }
    td.content-data:hover { background-color: #FFFFFF; }
    #download_button:hover { background-color: #FFFFFF; }

有什么想法吗？

【问题讨论】：

标签： html css firefox html-table

【解决方案1】：

在您的 table.content 规则中，添加 border-collapse: collapse;。

【讨论】：

【解决方案2】：

table { 
    border-spacing:0;
    border-collapse:collapse;
}

看到这个帖子：Set cellpadding and cellspacing in CSS?

【讨论】：