[csswg-drafts] [css-overflow-4] Allow scrollable overflow to be visible in the off-axis / overflow-clip-margin (#13445)

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

== [css-overflow-4] Allow scrollable overflow to be visible in the off-axis / overflow-clip-margin ==
When developers create scroll containers that only scroll in one direction, they’ll sometimes have use cases where content needs to overflow visually in the other axis. Per the [css-overflow-3](https://www.w3.org/TR/css-overflow-3/#valdef-overflow-clip:~:text=compute%20to%20auto/hidden) spec:

> The [visible](https://www.w3.org/TR/css-overflow-3/#valdef-overflow-visible)/[clip](https://www.w3.org/TR/css-overflow-3/#valdef-overflow-clip) values of [overflow](https://www.w3.org/TR/css-overflow-3/#propdef-overflow) compute to [auto](https://www.w3.org/TR/css-overflow-3/#valdef-overflow-auto)/[hidden](https://www.w3.org/TR/css-overflow-3/#valdef-overflow-hidden) (respectively) if one of [overflow-x](https://www.w3.org/TR/css-overflow-3/#propdef-overflow-x) or [overflow-y](https://www.w3.org/TR/css-overflow-3/#propdef-overflow-y) is neither visible nor clip.

Per WG [\#12289](https://github.com/w3c/csswg-drafts/issues/12289):

> RESOLVED: Allow overflow: clip in other axis of a scrollable container. It is still a scroll container but prevents scrolling away from origin in that axis

This means if you set the off-axis to `clip`, it will clip the contents as expected. However, if you set the off-axis to `visible`, it will compute to `auto`. This leads to the same sort of issues as [\#12289](https://github.com/w3c/csswg-drafts/issues/12289), such as calls to scrollIntoView or anchor link scrolls accidentally scrolling vertical content.

Additionally, it is unclear if `overflow-clip-margin` applies to `clip` in the off-axis. If allowed, setting this to a high value (e.g. `100vh`) would be equivalent to `visible`. It would be preferable to allow an intentional solution here. Also, it would allow `content-visibility:auto` to work with ink overflow in the off-axis.

An example use case is a [Horizontal Carousel](https://jsbin.com/niqoyay/edit?html,css,output) with off-axis visual overflow. It’s possible to get similar effects with negative margins or anchor positioning \- but are more complex to create and maintain.

**Proposal 1**: We should allow `overflow-clip-margin` to apply in the off-axis when set to `clip`, expanding the overflow clip edge for a single axis.

**Proposal 2**: If we accept (1), allow overflow `visible` in the off-axis, enabling elements to allow visual overflow for a single axis.

/cc @flackr 

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


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

Received on Tuesday, 3 February 2026 20:58:00 UTC