title: Chrome bug with colspan and border?
body: <p>In the example below, there is a border on top of the right cell. It only appears in Chrome, is it a Chrome bug?</p>
  <h3>HTML / CSS</h3>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>html,
  body {
    height: 100%;
  }
  table {
    border-collapse: collapse;
    width: 100%;
    height: 100%;
  }
  .left {
    border-right: 1px #aaaaaa solid;
    border-top: 1px #aaaaaa solid;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table&gt;
    &lt;tr&gt;
      &lt;td colspan=2&gt;top&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td class="left"&gt;left&lt;/td&gt;
      &lt;td&gt;right&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Here is the example <a href="http://jsfiddle.net/5366whmf/" rel="noreferrer">as a fiddle</a>.</p>
  <h3>Chrome Screenshot</h3>
  <p><a href="https://i.stack.imgur.com/YoYAd.png" rel="noreferrer"><img src="https://i.stack.imgur.com/YoYAd.png" alt="Example" /></a></p>