blob: 33c2565841df207033be666da39dd5264bfc77b5 [file] [log] [blame]
<!DOCTYPE html><!-- webkit-test-runner [ experimental:WebAnimationsCSSIntegrationEnabled=false ] -->
<html>
<head>
<style>
@keyframes play {
from {
background-size: 5% 100%;
}
to {
background-size: 50% 100%;
}
}
button {
width: 200px;
height: 200px;
box-sizing: border-box;
border: 1px solid black;
background-image: linear-gradient(blue, blue), linear-gradient(blue, blue);
background-position: top left, top right;
background-size: 45% 100%;
background-repeat: no-repeat;
animation: play 1000000s -10000s linear;
}
</style>
</head>
<body>
<p>Should see symmetrical strips of color down both sides.</p>
<button></button>
</body>
</html>