Border-radius with a background image appears to be broken in webkit (tested in both Chrome and Safari on Mac). Check out how much the background colour bleeds over the corner. Is this a known issue? I came across this randomly on the Winnipeg Free Press mobile site. It looks like the same issue is not affecting the WordPress UI I’m currently typing it. I haven’t had time to try to duplicate the issue yet. What are the combination of factors that cause this bug to appear?
Categories
3 replies on “Border-Radius Broken in Webkit?”
It’s a border-clip issue. Webkit specific as well; you can set the border to cut off within the padding, within the margin, or on-par with the border; which is default, and why rounded corners look like junk sometimes.
Thanks, this is helpful!
Urgh, prematurely hit post.
Here’s something helpful: http://www.css3.info/preview/background-origin-and-background-clip/