Bug 193656 - [css-grid] abspos inside grid can have negative sizes
Summary: [css-grid] abspos inside grid can have negative sizes
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2019-01-21 11:51 PST by Oriol Brufau
Modified: 2022-08-07 05:05 PDT (History)
4 users (show)

See Also:


Attachments
testcase (552 bytes, text/html)
2019-01-21 11:51 PST, Oriol Brufau
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Oriol Brufau 2019-01-21 11:51:28 PST
Created attachment 359700 [details]
testcase

Run this code: https://jsfiddle.net/9mjg2fxt/

```css
#grid {
  display: grid;
  grid: 100px / 100px;
  border: solid;
  width: 100px;
  height: 100px;
  position: relative;
}
#abspos {
  position: absolute;
  left: 30px;
  right: 40px;
  grid-column-end: 1;
  color: cyan;
  border: 10px solid blue;
}
```
```html
<div id="log"></div>
<div id="grid">
  <div>
    <div id="abspos"></div>
  </div>
</div>
```
```js
let w = document.getElementById('abspos').offsetWidth;
document.getElementById("log").textContent = "offsetWidth = " + w;
```

Result: the offsetWidth is -70, and no blue border is shown
Expected: It should be 20 instead. And the blue border should be visible.

Chromium and Firefox do it correctly.
Comment 1 Ahmad Saleem 2022-08-07 05:04:54 PDT
I am unable to reproduce the bug using attached test case in attachment field using Safari 15.6 on macOS 12.5 and it shows "offset of 20 px" similar to other browsers (Chrome Canary 106 and Firefox Nightly 105). I am marking this as "RESOLVED CONFIGURATION CHANGED". Thanks!