CSS border-radius bleed with dark colors

Question

I've got a containing box that has a border-radius then I have an element within the container that also has a border-radius set, and it butts up against the edges of the box.

The containing box is "bleeding" around the edges of the interior box:

You can see it in action here: http://jsfiddle.net/Shpigford/RUAMx/

How can I fix this?

Answer 1

It's easy to fix setting bigger radius for container border:

div {
    background:white;
    border-radius: 5px 8px 8px 5px;
}

See here http://jsfiddle.net/RUAMx/2/

In addition you don't have to use -webkit and -moz preffixes anymore, support for border-radius is good enough.