Re: [csswg-drafts] [css-images-4][css-overflow-3] How do `object-overflow` and `object-view-box` interact with `overflow` and `overflow-clip-margin`? (#7144)

This is a follow up to the open questions from the previous resolution on this issue:

* Adding a use counter to measure the usage of overflow:visible. Since this change would change the behaviour of this property for replaced elements and cause ink overflow.

* Clarifying the behaviour for overflow values other than visible or clip.

The use counter data collected by Chrome over 1 week of a stable release (M102) is as follows. We collected 2 different counters explained below.

* The first measures any instance where `overflow` is explicitly set from developer styles to `visible`. The percentage of page loads with this is **2.16%**.

* The second measures the above instances but only includes the cases with `object-fit` set to `cover` or `none` or `object-position` set to any value other than the default (50% 50%). The rationale behind this counter is to exclude cases which can not cause overflow (such as `object-fit:contain`), even if `overflow` is set to `visible`. The percentage of page loads with this is **0.017%**.

Also note that the data above is limited to replaced elements excluding `<svg>` and embedded content (`<iframe>`, `<embed>`, `<object>`). The reason for this is as follows:

* `<svg>` already supports using `overflow:visible` so no behaviour change is needed.
* We don’t intend to allow visible overflow for embedded elements so no behaviour change is needed.

Assuming the usage is low enough to accept a change in behaviour, the proposal is as follows:

* `overflow: visible` on all replaced elements causes any potential overflow to paint as ink overflow.
* Values other than `clip` or `visible`, if specified, are coerced to `clip`. This implies that overflow values can be different in x and y directions.
* UA CSS specifies the following style rules to implement the default behaviour of replaced elements which clip to the content-box.

  ```css
  img, video, canvas, svg:not(:root) {
     overflow: clip;
     overflow-clip-margin: content-box;
  }
  
  iframe, object, embed, fencedframe {
     overflow: clip !important;
     overflow-clip-margin: content-box !important;
  }
  ```

Note that the change above is consistent with the current behaviour for `<svg>` where all values other than `visible` clip the element’s contents but don’t make the element scrollable:

```html
​​<html>
<body>
<svg id=foo style="border: 1px solid black; width: 200px; height: 200px; overflow: scroll;">
  <rect x="100" y="100" width="200" height="200" fill="blue"></rect>
</svg>
</body>
<script>
  foo.scrollTo(0, 50);
</script>
</html>
```

This proposal would change the UA style rule to override overflow for svg from `hidden` to `clip` ([spec](https://svgwg.org/svg2-draft/single-page.html#render-OverflowAndClipProperties)), which aligns with the implemented behaviour.

-- 
GitHub Notification of comment by khushalsagar
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7144#issuecomment-1160794521 using your GitHub account


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

Received on Monday, 20 June 2022 19:49:35 UTC