我在所有主要浏览器（测试：IE 9、Chrome、Firefox）下渲染边界半径都有一个错误。
发生的事情是我有一个带有边框半径的菜单栏，其中一些链接宽度为背景颜色。为了使按钮保持在菜单的形状内，我在菜单容器上设置了一个溢出隐藏。直到一切顺利，然后，角落边缘出现了一条小白线。
我在这里做了一个简化的测试用例：http: //dabblet.com/gist/3828561
有人有解决方案来克服这个问题吗？谢谢！
问问题
1886 次
1 回答
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; }
于 2012-10-03T18:12:05.933 回答