8000 [css-overflow][css-overflow-4][proposal] Define the scrollable area of an element · Issue #3428 · w3c/csswg-drafts · GitHub
[go: up one dir, main page]

Skip to content

[css-overflow][css-overflow-4][proposal] Define the scrollable area of an element #3428

@andyearnshaw

Description

@andyearnshaw

https://drafts.csswg.org/css-scrollbars-1/

Following on from my previous proposal of scrolling elements that have no "natural" overflow (which this doesn't depend on but would be a smart addition for that), there are elements that have fixed, non-scrollable areas. You can sometimes solve this problem by using other elements to separate the scrollable area. However, sometimes they may converge on both axis at a specific area, but outside of that area the content is still scrollable on one of the axis. That's not a great way of articulating the problem, I suppose, but here is an image that might help:

In this example, the green area represents horizontally-scrollable content and the red area represents vertically-scrollable content. Because of how scrollbars automatically take up 100% of the available height or width of an element, you can't limit them to the area that will actually change if you move those bars.

The idea I had for this was just to define a new property, e.g. scroll-area that allows you to set the rectangle for the intersecting scrollable area, so that the scrollbars don't overlap non-scrollable areas on their respective axis.

:host {
    scroll-area: inset(10%, 0, 0, 10%);
}

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      0