[csswg-drafts] [css-backgrounds] Border radius and scrollbars (#4643)

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

== [css-backgrounds] Border radius and scrollbars ==
I've found that the behavior of the following example is very different in Chromium/WebKit vs Firefox:
```html
<div style="width: 500px; height: 500px; border-radius: 100px;
            border: solid thick; background: magenta; overflow: scroll;">
</div>
```

![Screenshots of previous example in Chrome and Firefox](https://user-images.githubusercontent.com/11602/71663639-4bc72080-2d56-11ea-9ec3-203e62aa64d8.png)

In Chromium/WebKit border-radius still applies to the corners with scrollbars (all but the top-left corner), however in Firefox it only applies to the top-left corner.

According to the spec (https://drafts.csswg.org/css-backgrounds-3/#corner-clipping):
> Other effects that clip to the border or padding edge (such as overflow other than visible) also must clip to the curve.

I understand it means that it should clip all the corners, but I'm not sure if that makes a lot of sense having scrollbars, at least the Chromium/WebKit behavior is kind of weird.

What's the expected behavior here? Should we update the spec accordingly?


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

Received on Thursday, 2 January 2020 10:53:16 UTC