Re: [csswg-drafts] [css-nav-1] Proper definition of 'spatial-navigation-action' property (#4449)

> There is [`spatial-navigation-action` CSS property ]( can define the spatial navigation behavior for the scrollable element.
> Currently, the spec describes this property is applied to **scroll containers** and **not be inherited**.
> I'd like to ask if this description is proper.
> If the scrollable element is specified with `spatial-navigation-action`, its children element which are all kinds of element also be affected by the feature of the property.
> For example, if there is a page like below,
> ```
> <div class="container" tabindex="0" style="width:600px; height:100px; overflow-y: scroll; spatial-navigation-action: focus;">
>    <button id="box1" class="box" style="top: 170px; left: 100px;"></button>
>    <button id="box2" class="box" style="top: 550px; left: 100px;"></button>
>   ...
>     <button  id="box10" class="box" style="top: 550px; left: 100px;"></button>
> </div>
> ```
> ('focus' value for `spatial-navigation-action` means that the directional input only works for moving the focus, not scrolling.)
> Once the focus moves inside `.container` element, the focus moves among button elements.
> But the behavior of moving the focus by directional input works as just moving the focus and not scrolling manually. This is because the button elements still are affected by `spatial-navigation-action: focus` which specified on the `.container` element.
> [This demo]( shows how this works.
> Does the current description of the property suit the intended behavior that is described in the spec and shown in the demo above?
> For my understanding, the CSS property which isn't inherited but affects the applied element's children is the one who creates the stacking context.
> Am I understanding right?
> Can `spatial-navigation-action` also create a stacking context?


GitHub Notification of comment by jihyerish
Please view or discuss this issue at using your GitHub account

Received on Friday, 25 October 2019 09:57:56 UTC