| <!DOCTYPE html> |
| <html> |
| <head> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| </script> |
| <style> |
| #a { |
| background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(black)); |
| -webkit-background-size: auto 50px; |
| -webkit-box-sizing: border-box; |
| border: 1px solid black; |
| width: 100px; |
| height: 2px; |
| } |
| #b { |
| background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(black)); |
| -webkit-background-size: 50px auto; |
| -webkit-box-sizing: border-box; |
| border: 1px solid black; |
| width: 2px; |
| height: 100px; |
| } |
| #c { |
| background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(black)); |
| -webkit-background-size: contain; |
| -webkit-box-sizing: border-box; |
| border: 1px solid black; |
| width: 2px; |
| height: 100px; |
| } |
| #d { |
| background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(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> |