Fixing the background ‘bleed’

I recently came up against an issue in Safari where the background colour of an element seemed to ‘bleed’ through the edge of the corners when applying both borders and a border-radius (see the image above). After seeing David Cole tweet about the same issue I resolved to find a solution, and it came in the form of the -webkit-background-clip property.

-webkit-background-clip: padding-box;

It’s important to note that if you are using the shorthand notation to specify your other background properties then this should be added after those. It seems that the shorthand notation implies a default clip value which will override one that’s previously set. Your mileage may vary, but it worked a treat for me. Read more about the available values for the property here.

Update: This post has been generously translated into Bulgarian by Albert Ward.

667 notes

Show

  1. seo---service reblogged this from sneak
  2. free-vip-themes reblogged this from sneak
  3. laphotos reblogged this from sneak
  4. best-driver-shafts-2012 reblogged this from sneak
  5. emanuelaluizapopa reblogged this from sneak
  6. druckerpatronen-hp-ch562ee reblogged this from sneak
  7. patronen-epson-stylus-sx125 reblogged this from sneak
  8. modernlivingroomfurniture reblogged this from sneak
  9. vetement-grande-taille reblogged this from sneak
  10. long-layered-hairstyles reblogged this from sneak
  11. mid-length-hairstyles reblogged this from sneak
  12. best-lcd-hdtv-2012 reblogged this from sneak
  13. cheapflightsinindia reblogged this from sneak
  14. aumento-penis reblogged this from sneak
  15. xbox360-controller-driver reblogged this from sneak
  16. raspberry-ketone-supplements reblogged this from sneak
  17. depressed-teens-2 reblogged this from sneak
  18. pizza-in-bend-oregon reblogged this from sneak
  19. dublin-removals reblogged this from sneak
  20. removals-dublin reblogged this from sneak
  21. get-over-depression-now reblogged this from sneak
  22. play-online-slots reblogged this from sneak
  23. sneak posted this