- From: Emilio Cobos Álvarez via GitHub <sysbot+gh@w3.org>
- Date: Sat, 15 Sep 2018 19:20:16 +0000
- To: public-css-archive@w3.org
emilio has just created a new issue for https://github.com/w3c/csswg-drafts:
== [cssom] Sticky position percentage values for inset properties. ==
Consider the test-case:
```html
<!doctype html>
<div id="log"></div>
<div style="height: 500px; background: purple; overflow: hidden;">
<div style="height: 400px; background: yellow;">
<div id="target" style="height: 100px; position: -webkit-sticky; position: sticky; left: 0; top: 50%; background: blue;">
</div>
</div>
</div>
<script>
log.innerHTML = getComputedStyle(target).top;
</script>
```
Every browser resolves the percentage during layout relative to the `overflow: hidden` container (that is, the closest scrollable box), so `#target` is positioned 250px from the top.
However, every browser except Gecko resolves the percentage in `getComputedStyle` against the containing block (the yellow box), returning 200px instead.
I think I should file bugs against the other browsers and clarify the spec because those percentages make no sense, but I'm not sure if I'm missing something...
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3115 using your GitHub account
Received on Saturday, 15 September 2018 19:20:17 UTC