<!DOCTYPE html>

<html>
<head>
<style type="text/css" media="screen">
    #test {
      width: 100px;
      height: 100px;
      background-color: red;
      position: fixed;
      top: 10px;
      left: 10px;
      -webkit-transform: translate(50px, 50px);
    }
    
    .box:hover {
        background-color: green;
    }
</style>
    <script type="text/javascript">
        if (window.testRunner)
            testRunner.waitUntilDone();
        function runTest()
        {
            document.getElementById('test').style.background='green';
            if (window.testRunner)
                testRunner.notifyDone();
        }
    </script>
</head>
<body onload="setTimeout(runTest, 0);">

<!--
    https://bugs.webkit.org/show_bug.cgi?id=36686
    Test repainting of a fixed-position element with a transform.
    The box should be entirely green.
-->
<div id="test"></div>

</body>
</html>