Bug 103730

Here's a fiddle showing the problem: http://jsfiddle.net/Hgb4Y/ So what's going on: 1. The box has a border radius of 50% making it a circle 2. The box has a background color 3. I want this circle to have a semi-transparent border so I apply a border rule with rgba color 4. Problem - the circles's background shows through the border, but I want the border outside. 5. When I apply background-clip padding-box I should get the desired result, however in webkit the clipped background isn't round anymore. In case the fiddle get deleted, here's the relevant css bit: .test { width: 200px; height: 200px; margin: 100px; background: red; border-radius: 50%; border: 30px solid rgba(0,0,0,0.5); background-clip: padding-box; }