title: Chrome Border-Radius and Opacity poss bug?
body: <p>Can anyone please help me with this, I have made a <a href="http://jsfiddle.net/tRzc6/8/" rel="nofollow">jsfiddle</a> to illustrate my problem...</p>
  
  <p>When I try add </p>
  
  <pre><code>opacity: 0.6;
  </code></pre>
  
  <p>to the class </p>
  
  <pre><code>.menuitem {}
  </code></pre>
  
  <p>the border-radius no longer applies... Using the jsfiddle, try removing opacity and re-run it you will see what I mean. Is this a bug or am I missing something? The problem seems to be only in Chrome, but possibly in Safari aswell.</p>
  
  <p>Thanks in advance</p>
  
  <p>EDIT: The reason behind applying the border-radius to the .mask element is that the child divs .menuitem are marginTop animated in jQuery to slide down on mouseover. This means to have rounded corners on these items it needs to pass underneath the rounded mask as it were.</p>
  
  <p>Hopefully that makes sense..</p>