title: IE border-radius - specific part still square, despite (seemingly) valid CSS rule
body: <p>I have been having problems with one div, the header of my site, which has the rule:</p>
  
  <pre><code>div#header {
  width:100%;
  background-color:#660066;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#330033), to(#990099), color-stop(.5,#660066));
  background: -moz-linear-gradient(top, #330033 0%, #660066 50%, #990099 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#330033', endColorstr='#990099',GradientType=0 );
  -moz-border-radius: 15px 15px 0px 0px;
  -webkit-border-radius: 15px 15px 0px 0px;
  border-radius:15px 15px 0px 0px;
  -moz-box-shadow: 3px 0px 3px #888;
  -webkit-box-shadow: 3px 0px 3x #888;
  box-shadow: 3px 0px 3px #888;
  }
  </code></pre>
  
  <p>Yet in IE9 the top left and right is not rounded. In Chrome, Safari and Firefox they are.</p>
  
  <p><a href="http://www.crgsshare.tk/" rel="nofollow">See it here</a> (the header div contains the logo and the "CRGS Share
  Student File Sharing System" title)</p>
  
  <p>Do you know what could be the cause? It's probably just me being a noob.</p>
  
  <p><a href="http://www.crgsshare.tk/styles.css" rel="nofollow">Full stylesheet here</a> (it's messy as it's a bit of a work in progress).</p>
  
  <p>Cheers in advance.</p>