Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[css-cascade-6] Scope Proximity & Sibling-Element Hops #10299

Open
dshin-moz opened this issue May 9, 2024 · 1 comment
Open

[css-cascade-6] Scope Proximity & Sibling-Element Hops #10299

dshin-moz opened this issue May 9, 2024 · 1 comment
Labels
css-cascade-6

Comments

@dshin-moz
Copy link

In describing scope proximity in terms of cascade precedence, the spec mentions:

When comparing declarations that appear in style rules with different scoping roots, then the declaration with the fewest generational or sibling-element hops between the scoping root and the scoped style rule subject wins.

Elements being in scope is a purely ancestor-descendant affair, so the mention of sibling hops doesn't make sense to me. Sibling of a scope root would, by definition, be not in scope. One possible interpretation would be to count sibling and ancestor hops for the matched selector, but I'm not sure how useful/intuitive that is. Also, I don't think any supported browser does that, given the below example always uses green:

<!DOCTYPE html>
<style>
@scope(.scope-start-1) {
  .styled {
    color: blue;
  }
}

@scope(.scope-start-2) {
  .sibling + .sibling + .sibling + .sibling + .styled {
    color: green;
  }
}
</style>
<div class="scope-start-1">
  <div class="scope-start-2">
    <div class="sibling"></div>
    <div class="sibling"></div>
    <div class="sibling"></div>
    <div class="sibling"></div>
    <div class="styled">What color?</div>
  </div>
</div>

In short - Should the reference to "sibling hops" be removed?
@andruud
Copy link
Member

andruud commented May 14, 2024

In short - Should the reference to "sibling hops" be removed?

It was probably worded like that in anticipation of sibling scopes, which hasn't made it into the spec yet. In other words, proximity is one cascade criterion, that is either derived from the ancestor-descendant proximity (@scope), or from the sibling proximity (@scope-siblings).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
css-cascade-6
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@andruud @dshin-moz