<!doctype html> <html><head><title>455105-2</title> <style> div#below { position: absolute; top: 10px; left: 10px; width: 40px; height: 40px; border: 10px solid red; background-color: red; } div#above { position: absolute; top: 10px; left: 10px; width: 40px; height: 40px; border-width: 10px; border-style: solid; border-color: green; /* one pixel green */ background-image: url("data:image/gif;base64,\ R0lGODlhAQABAPAAAACAAAAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw=="); /* three by three pixel transparent - drawn *instead of* regular border */ border-image: url("data:image/gif;base64,\ R0lGODlhAwADAPAAAAAAAAAAACH5BAEAAAAALAAAAAADAAMAAAIDhH8FADs=") 1 1; } </style> </head><body> <div id="below"></div> <div id="above"></div> </body></html>