| <!doctype html> |
| <script src='/resources/testharness.js'></script> |
| <script src='/resources/testharnessreport.js'></script> |
| <script src='/resources/check-layout-th.js'></script> |
| <link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org"> |
| <link rel="help" href="https://www.w3.org/TR/css-tables-3/#used-width-of-table"> |
| <meta name="flags" content="" /> |
| <meta name="assert" content="When sizing and positioning abspos tables, the specified width is obeyed when the intrinsic width is smaller" /> |
| <style> |
| .cb { |
| position: relative; |
| height: 200px; |
| width: 200px; |
| outline: 2px dashed lightblue; |
| } |
| |
| .table { |
| background-color: orange; |
| position: absolute; |
| width: 50px; |
| right: 0px; |
| } |
| |
| .cell { |
| border: 1px solid green; |
| width: 100px; |
| } |
| |
| .cell > div { |
| width: 20px; |
| } |
| |
| .vertical { writing-mode: vertical-lr; } |
| .horizontal { writing-mode: horizontal-tb; } |
| </style> |
| |
| <output id="log"></output> |
| |
| <main> |
| <div class="cb"> |
| <table class="table" data-expected-width=50 data-offset-x="150"> |
| <tr> |
| <td class="cell" data-expected-width=46> |
| <div></div> |
| </td> |
| </tr> |
| </table> |
| </div> |
| <div class="cb vertical"> |
| <table class="table horizontal" data-expected-width=50 data-offset-x="150"> |
| <tr> |
| <td class="cell" data-expected-width=46> |
| <div></div> |
| </td> |
| </tr> |
| </table> |
| </div> |
| <div class="cb"> |
| <table class="table vertical" data-expected-width=108 data-offset-x="92"> |
| <tr> |
| <td class="cell" data-expected-width=104> |
| <div></div> |
| </td> |
| </tr> |
| </table> |
| </div> |
| <div class="cb vertical"> |
| <table class="table vertical" data-expected-width=108 data-offset-x="92"> |
| <tr> |
| <td class="cell" data-expected-width=104> |
| <div></div> |
| </td> |
| </tr> |
| </table> |
| </div> |
| </main> |
| <script> |
| checkLayout(".table"); |
| </script> |