<!DOCTYPE html>
<html>
<head>
<script>
if (window.testRunner)
testRunner.dumpAsText();
</script>
<style>
#a {
background-image: linear-gradient(white, black);
-webkit-background-size: auto 50px;
-webkit-box-sizing: border-box;
border: 1px solid black;
width: 100px;
height: 2px;
}
#b {
background-image: linear-gradient(white, black);
-webkit-background-size: 50px auto;
-webkit-box-sizing: border-box;
border: 1px solid black;
width: 2px;
height: 100px;
}
#c {
background-image: linear-gradient(white, black);
-webkit-background-size: contain;
-webkit-box-sizing: border-box;
border: 1px solid black;
width: 2px;
height: 100px;
}
#d {
background-image: linear-gradient(white, black);
-webkit-background-size: contain;
-webkit-box-sizing: border-box;
border: 1px solid black;
width: 100px;
height: 2px;
}
</style>
</head>
<body>
<p>Test of some edge cases for background fills with generated images. Test passed if it rendered and there was no division by zero.</p>
<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
<div id="d"></div>
</body>
</html>