title: FireFox CSS Table Extra Border Line
body: <p>I encountered a table border line CSS problem in Firefox, when the CSS border-collapse is collapse, and have 2 merged cells, one of them has a 1px border. An extra unwanted border line exists on the right.
  This problem does not exist in other browsers, IE and Chrome don't have the problem.</p>
  
  <p>FireFox version is </p>
  
  <blockquote>
    <p>Mozilla/5.0 (Windows; U; Windows NT
    5.1; zh-CN; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8 (.NET CLR 3.5.30729)</p>
  </blockquote>
  
  <p>My tested doctype is:</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;
  </code></pre>
  
  <p>.</p>
  
  <hr>
  
  <p><img src="https://i.stack.imgur.com/mG4NQ.png" alt="alt text"></p>
  
  <pre><code>&lt;table cellspacing="0" cellpadding="0" style="position: absolute; width: 217px; left: 0px;border-collapse:collapse"&gt;
  &lt;colgroup&gt;&lt;col col="0" style="width: 72px;"&gt;&lt;col col="1" style="width: 72px;"&gt;&lt;col col="2" style="width: 72px;"&gt;
  &lt;/colgroup&gt;
  &lt;tbody&gt;
  &lt;tr tridx="0" style="height: 19px;"&gt;
  &lt;td rowspan="2" colspan="2" style="border: 1px solid #000000"&gt;&lt;/td&gt;&lt;td row="0" col="2"&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr tridx="1" style="height: 19px;"&gt;&lt;td row="1" col="2"&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr tridx="2" style="height: 19px;"&gt;&lt;td row="2" col="0"&gt;&lt;/td&gt;&lt;td row="2" col="1"&gt;&lt;/td&gt;&lt;td row="2" col="2"&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr tridx="3" style="height: 19px;"&gt;&lt;td rowspan="3" colspan="2" style="border: 1px solid #000000"&gt;&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr tridx="4" style="height: 19px;"&gt;&lt;td &gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr tridx="5" style="height: 19px;"&gt;&lt;td&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>