<!DOCTYPE html> <html lang="en-US"> <head> <title>test of border-image</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> div.p1 { background: red; /* fail if this shows through */ background-image: url('3x3multicolor.png'); /* fail if this shows through */ border-width: 1px 3px; border-style: solid; border-image: url('4x4multicolor.png') 1 1 1 1 repeat; -khtml-border-image: url('4x4multicolor.png') 1 1 1 1 repeat; border-image: url('4x4multicolor.png') 1 1 1 1 repeat; } div.p2 { background: red; /* fail if this shows through */ background-image: url('3x3multicolor.png'); /* fail if this shows through */ border-width: 1px 3px; border-style: solid; border-image: url('4x4multicolor.png') 1 1 1 1; -khtml-border-image: url('4x4multicolor.png') 1 1 1 1; border-image: url('4x4multicolor.png') 1 1 1 1; } </style> </head> <body> <div class="p1" style="width: 4px; height: 2px"></div> <!--<div class="p2" style="width: 4px; height: 2px"></div> --> </body> </html>