title: IE9 rounded corners and transparent background issues
body: <p>I have searched a lot, but I can't really find an answer to this.</p>
  
  <p>I have rounder borders all over, everywhere it's fine, except on the elements which are using img as background (image get nice rounded corners, but behind is some sort of black background).</p>
  
  <p>PICTURE for easier understanding of the issue:</p>
  
  <p><a href="https://i.stack.imgur.com/TRTtV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TRTtV.png" alt=""></a>
  </p>
  
  <p>I'm really stuck on this. Any suggestions is this IE issue or am I missing something?</p>
  
  <p>CSS of gray header is something like this:</p>
  
  <pre><code>#header {
      background-image: url("images/bg-header.png");
      background-repeat: repeat-x;
      border-radius: 4px 4px 0 0;
      color: #FFFFFF;
      font-size: 13px;
      font-weight: bold;
      height: 46px;
      line-height: 46px;
      padding: 0 0 0 15px;
      text-shadow: 0 -1px 0 #332829;
      width: 575px;
  }
  </code></pre>
  
  <p>FIDDLE:</p>
  
  <pre><code>http://jsfiddle.net/2BnDR/2/
  </code></pre>