[csswg-drafts] [css-overflow] Specify computed value of overflow for display: table (#8133)

fred-wang has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-overflow] Specify computed value of overflow for display: table ==
From https://www.w3.org/TR/css-overflow-3/#overflow-properties

> The computed value of overflow-x/y are "as specified, except with visible/clip computing to auto/hidden (respectively) if one of overflow-x or overflow-y is neither visible nor clip"

Here is a testcase using elements with `display: table`:

```
<!DOCTYPE html>
<table style="overflow: visible"></table>
<table style="overflow: hidden"></table>
<table style="overflow: scroll"></table>
<table style="overflow: clip"></table>
<table style="overflow-x: hidden; overflow-y: visible"></table>
<table style="overflow-x: auto; overflow-y: clip"></table>
<textarea id="output" cols="80" rows="40"></textarea>
<script>
 Array.from(document.getElementsByTagName('table')).forEach(table => {
   output.textContent += `Table with ${table.getAttribute('style')}\n`;
   output.textContent += `  overflowX: ${window.getComputedStyle(table).overflowX}\n`;
   output.textContent += `  overflowY: ${window.getComputedStyle(table).overflowY}\n\n`;
  });
</script>
</script>
```

Firefox follows the spec here and output the following for the two last elements:

```
Table with overflow-x: hidden; overflow-y: visible
  overflowX: hidden
  overflowY: auto

Table with overflow-x: auto; overflow-y: clip
  overflowX: auto
  overflowY: hidden
```

Chrome resolves everything to visible instead, see https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/css/resolver/style_adjuster.cc;l=503;drc=c78c35fff237598ae5022a8d3ff5f8ee20b894ce :

```
Table with overflow-x: hidden; overflow-y: visible
  overflowX: visible
  overflowY: visible

Table with overflow-x: auto; overflow-y: clip
  overflowX: visible
  overflowY: visible
```

For WebKit, I'm getting this:

```
Table with overflow-x: hidden; overflow-y: visible
  overflowX: hidden
  overflowY: visible

Table with overflow-x: auto; overflow-y: clip
  overflowX: visible
  overflowY: hidden
```

It would be good to specify an interoperable interpretation for tables.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8133 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 25 November 2022 15:26:19 UTC