<!DOCTYPE html>

<p>Test PASS if you see two adjacent iframes with a 50x50 green square.</p>

<iframe height="120px" width="300px" srcdoc="
     <style>
     .grid {
         display: grid;
         grid: 50px / 100px 50px 150px 100px;
     }
     </style>

     <div class='grid'>
         <div style='background: red; grid-column: 2;'></div>
         <div style='background: green;  grid-column: 4; width: 50px; margin-left: -200px;'></div>
     </div>
     ">
</iframe>

<iframe height="120px" width="300px" srcdoc="
     <style>
     .grid {
         display: grid;
         grid: 50px / 100px 50px 150px 100px;
         direction: rtl;
     }
     </style>

     <div class='grid'>
         <div style='background: red; grid-column: 2;'></div>
         <div style='background: green;  grid-column: 4; width: 50px; margin-right: -200px;'></div>
     </div>
     ">
</iframe>