diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-layout-api/edges/all-ref.html')
-rw-r--r-- | testing/web-platform/tests/css/css-layout-api/edges/all-ref.html | 161 |
1 files changed, 161 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-layout-api/edges/all-ref.html b/testing/web-platform/tests/css/css-layout-api/edges/all-ref.html new file mode 100644 index 0000000000..2a04f96e73 --- /dev/null +++ b/testing/web-platform/tests/css/css-layout-api/edges/all-ref.html @@ -0,0 +1,161 @@ +<!DOCTYPE html> +<style> +td { text-align: center; } + +.parent { + box-sizing: border-box; + width: 60px; + height: 60px; + border: solid; + border-width: 1px 2px 3px 4px; + padding: 0px 4px 8px 12px; + position: relative; +} + +.child { + position: absolute; + width: 10px; + height: 10px; + background: green; +} + +.top-left { + top: 0; + left: 12px; +} + +.top-right { + top: 0; + right: 4px; +} + +.bottom-left { + bottom: 8px; + left: 12px; +} + +.bottom-right { + bottom: 8px; + right: 4px; +} +</style> + +<table> + <tr> + <td></td> + <td colspan=2>LTR</td> + <td colspan=2>RTL</td> + </tr> + <tr> + <td></td> + <td>Y</td> + <td>X</td> + <td>Y</td> + <td>X</td> + </tr> + <tr> + <td>HTB</td> + <td> + <div class="parent" style="writing-mode: horizontal-tb; direction: ltr; overflow-y: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: horizontal-tb; direction: ltr; overflow-x: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: horizontal-tb; direction: rtl; overflow-y: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: horizontal-tb; direction: rtl; overflow-x: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + </tr> + <tr> + <td>VRL</td> + <td> + <div class="parent" style="writing-mode: vertical-rl; direction: ltr; overflow-y: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: vertical-rl; direction: ltr; overflow-x: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: vertical-rl; direction: rtl; overflow-y: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: vertical-rl; direction: rtl; overflow-x: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + </tr> + <tr> + <td>VLR</td> + <td> + <div class="parent" style="writing-mode: vertical-lr; direction: ltr; overflow-y: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: vertical-lr; direction: ltr; overflow-x: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: vertical-lr; direction: rtl; overflow-y: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + <td> + <div class="parent" style="writing-mode: vertical-lr; direction: rtl; overflow-x: scroll;"> + <div class="child top-left"></div> + <div class="child top-right"></div> + <div class="child bottom-left"></div> + <div class="child bottom-right"></div> + </div> + </td> + </tr> +</table> |