我在所有主要浏览器（已测试：IE 9，Chrome，Firefox）下渲染border-radius时出现错误。
我发生了一个带有border-radius的菜单栏，其中有一些链接宽度为背景颜色。为了使按钮保持在菜单的形状内，我设置了一个隐藏在菜单容器上的溢出。直到一切顺利，但随后，角落边缘出现了一条白线。
我在这里做了一个简化的测试用例：http://dabblet.com/gist/3828561
任何人都有解决方案来克服这个问题吗？谢谢！
答案 0 :(得分：0)
依赖于维度的解决方案......但也许没关系，因为它是一个菜单栏而不是内容持有者？无论如何，您可以在内部元素上设置border-radius，为父级设置高度，并为内部元素的line-height使用该高度值。
应用高度/行高后，您不必使用overflow: hidden。
由于菜单栏的边框半径为3px，因此请将相同的圆角应用于第一个菜单项的相应角落，如下所示：
.outer .inner:first-of-type { border-radius: 3px 0 0 3px; }
使条形的相应角更圆，将它们隐藏在第一个菜单项下面：
.outer { border-radius: 10px 3px 3px 10px; }