div border radius问题（在firefox和opera上）

Question

如你所见有两张照片。首先，在chrome上。右侧有Beğen和Yorumlar按钮.Border看起来非常好..

但第二张照片显示; firefox和opera有边框radius.I尝试做border-witdh：thin，border：1px solid等。但它看起来一样。

如何处理它？你有什么想法吗？

抱歉我的英语。谢谢你

image on chrome

image on ff and opera

Answer 1

这种效应通常被称为“背景流血”或“泄漏”。它可以通过一些简单的CSS修复：

-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;

我首先从Mike Harding的博客中了解到这一点：
http://tumble.sneak.co.nz/post/928998513/fixing-the-background-bleed

这是W3C规范：
http://www.w3.org/TR/css3-background/#the-background-clip

Answer 2

......看起来好像可以在不使用边框的情况下离开。按钮和背景之间有足够的对比度。您尝试使用1px（模糊半径）的外部发光吗？

-moz-box-shadow: [position-x] [position-y] [blur-radius] [color];
-webkit-box-shadow: [position-x] [position-y] [blur-radius] [color];
box-shadow: [position-x] [position-y] [blur-radius] [color];

Answer 3

帮助chome与border:1px double ...的边界。我知道chrome有半径边框的问题。将它设置为双倍而不是固定有助于清理它。有点烦人。