<!doctype html>
<html>
<head>
<style type="text/css" media="screen">
#div1 {
width: 100px;
height: 100px;
padding: 25px;
border: 25px dotted;
background-image: -webkit-linear-gradient(top, yellow, yellow), -webkit-linear-gradient(top, blue, blue), -webkit-linear-gradient(top, green, green);
background-clip: content-box, padding-box, border-box;
}
</style>
</head>
<body>
Test passes if the image below shows nested green, blue and yellow squares with a dotted black border.
<div id="div1"></div>
</body>
</html>