CSS - border-radius：背景图像颜色不适合

Question

我在HTML和CSS中有一个header-menue。垂直菜单的左右两端应具有圆形边框和不同的背景图像。没有圆形边框功能，它工作正常，（菜单的右端）看起来像这样：

当我在css中添加“border-radius：”功能时出现问题：

-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

现在示例如下：

正如你在这里看到的那样，allover-menue-background（从左边开始）和右边部分背景之间的颜色不符合它们应该的样子（仅在底部部分中有未知原因）我测试了它使用Firefox 22，Safari 6和IE 10 - 都具有相同的结果。

有谁知道，为什么会发生这种情况以及如何解决？

谢谢

Answer 1

可能你会保留这种解决方案。 否则 - 你也可以用img作为角落实现圆角......

Answer 2

感谢您的所有答案！我做了一个小伙子，自己找出了问题的原因：

这是jsfiddle：http://jsfiddle.net/vFTYh/

问题是，我在菜单下方有一个20像素的div容器。这个div有50px的阴影。

-moz-box-shadow: 0 0 50px #000;
-webkit-box-shadow: 0 0 50px#000;
box-shadow: 0 0 50px #000;

如果我添加此阴影，菜单背景和菜单背景的左侧部分会受到不同的影响。