title: How to get inset box-shadow work on thead in chrome?
body: <p>I have created this <a href="http://jsfiddle.net/etrfu/3/" rel="nofollow">very simple fiddle</a> to reproduce the issue. I does what's expected in firefox but not in chrome. Is there a workaround to achieve the same purpose ?</p>
  
  <p>Here is the HTML code:</p>
  
  <pre><code>&lt;table  cellpadding="1"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Adskldj&lt;/th&gt;
              &lt;th&gt;dfsdfd&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr&gt;&lt;th&gt;Adskldj&lt;/th&gt;&lt;th&gt;dfsdfd&lt;/th&gt;&lt;/tr&gt;
          &lt;tr&gt;&lt;th&gt;Adskldj&lt;/th&gt;&lt;th&gt;dfsdfd&lt;/th&gt;&lt;/tr&gt;
          &lt;tr&gt;&lt;th&gt;Adskldj&lt;/th&gt;&lt;th&gt;dfsdfd&lt;/th&gt;&lt;/tr&gt;
          &lt;tr&gt;&lt;th&gt;Adskldj&lt;/th&gt;&lt;th&gt;dfsdfd&lt;/th&gt;&lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>And the CSS</p>
  
  <pre><code>table {
      border-collapse:collapse;
  }
  td, th {
      border-top: 1px solid #888;
      border-bottom: 1px solid #888;
      padding: 30px;
  }
  thead {
      background-color: #DDD;
      box-shadow:inset 0 0 10px #000000;
  }
  </code></pre>