Content - 8ed7f552827dad020ed0a943ea4e899a0070cee7 - 226b5f9/css/css-transforms/transform3d-sorting-006-ref.html

visit type:

Tip revision: fe09e1e121e850ee1cf1c7f67333ad92e3904d78 authored by Morten Stenshorne on 26 March 2018, 14:00:45 UTC
[css-flexbox] Resolve min-width:auto on table item to min preferred size.

Tip revision: fe09e1e

transform3d-sorting-006-ref.html

<!DOCTYPE html>
<html>
  <head>
    <title>CSS Reftest Reference</title>
    <link rel="author" title="Aryeh Gregor" href="mailto:ayg@aryeh.name">
    <!--
    In a correct implementation, the bottom borders here will be invisible, because
    the later divs get painted on top.  This is to catch an incorrect pass in
    Safari on Windows, which draws the test file and the ref with the same error
    (painting the back halves on top) and so passes if the back halves are solid
    red and green.
    -->
  </head>
  <body>
    <div style="height: 70px; width: 50px; background: red;
      border-bottom: 30px solid black;
      transform: rotateX(45deg) rotateY(45deg);
      transform-origin: right"></div>
    <div style="height: 70px; width: 50px; background: green;
      border-bottom: 30px solid black;
      transform: translate(50px, -100px) rotateX(45deg) rotateY(-45deg);
      transform-origin: left"></div>
    <div style="height: 100px; width: 50px; background: red;
      transform: translate(50px, -200px) rotateX(45deg) rotateY(45deg);
      transform-origin: left"></div>
    <div style="height: 100px; width: 50px; background: green;
      transform: translateY(-300px) rotateX(45deg) rotateY(-45deg);
      transform-origin: right"></div>
  </body>
</html>

Browse the archive

https://github.com/web-platform-tests/wpt