W3C home > Mailing lists > Public > public-css-archive@w3.org > August 2019

Re: [csswg-drafts] [cssom-view] [css-tables] should table.clientWidth include borders? (#4245)

From: Boris Zbarsky via GitHub <sysbot+gh@w3.org>
Date: Tue, 27 Aug 2019 23:32:24 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-525522722-1566948743-sysbot+gh@w3.org>
So Chrome's behavior around this stuff is just ... odd.  In particular, `clientHeight` for Chrome includes the height of the caption, but not the height of the borders of the table grid.   Simple testcase with various whitespace removed to make it easy to see what's going on:
```
<!doctype html>
<table style="border: 10px solid" cellspacing="0" cellpadding="0">
  <tr><td style="height: 100px">One</td></tr>
  <caption style="height: 33px">Two</caption>
</table>
<pre><script>
    var t = document.querySelector("table");
    document.writeln(t.clientTop);
    document.writeln(t.clientLeft);
    document.writeln(t.clientHeight);
    document.writeln(t.offsetHeight);
</script>
```
In Chrome this logs `10`, `10`, `133`, `153`, which can't be explained by _any_ choice of box for the `client*` calculations.  In Gecko it logs `0`, `0`, `153`, `153`, which corresponds to using the table wrapper box.

With `caption-side: bottom` on the table, it's even more fun: at that point `t.clientTop + t.clientHeight` is some random point in the middle of the caption (20px above the bottom of the caption).  Chrome doesn't support `caption-side: left`, so can't test how captions affect `clientWidth`.  Setting a larger-than-the-table-grid's-width width on the caption makes the table grid larger in Chrome, so can't test the effect on `clientWidth` that way either...

-- 
GitHub Notification of comment by bzbarsky
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4245#issuecomment-525522722 using your GitHub account
Received on Tuesday, 27 August 2019 23:32:26 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 19 October 2021 01:31:13 UTC