third_party/WebKit/LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-different-writing-modes.html

   1 <!DOCTYPE html>
   2 <title>shape-outside on floats with a different writing mode in the float and the container</title>
   3 <style>
   4     .container {
   5         font: 20px/1 Ahem;
   6         color: green;
   7     }
   8     .float {
   9         -webkit-writing-mode: vertical-lr;
  10         shape-outside: polygon(-20px 0px, 0px 0px, 0px 20px, -20px 20px) content-box;
  11         height: 20px;
  12         width: 40px;
  13         margin: 0px 20px;
  14         background-color: red;
  15         float: left;
  16     }
  17 </style>
  18 <body>
  19     <p><a href="https://bugs.webkit.org/show_bug.cgi?id=122243">Bug 122243</a> - [css-shapes] shape-outside does not properly handle the container and the float having different writing modes</p>
  20     <p>You should see a single green rectangle. You should not see any red.</p>
  21     <div class="container">
  22         <div class="float"></div>
  23         XX
  24     </div>
  25 </body>