Re: [csswg-drafts] [css-ui] select:hover and select:active styles (#11185)

Thanks for the great ideas in the discussion. It sounds like there are roughly four options on the table:
1. Top layer elements "break" the hover/active inheritance (as [described](https://github.com/w3c/csswg-drafts/issues/11185#issuecomment-2537590091))
2. Mint a new CSS property (or new value for e.g. `contain`) that breaks the hover/active inheritance
3. Mint a new HTML attribute that breaks the hover/active inheritance
4. Create new CSS properties, like `:hover-on` that doesn't inherit at all

Briefly listing pros/cons:

**Option <span>#</span>1 (break at top layer):**
 - Pros:
    - Solves for customizable-`<select>`
    - Likely works as expected in most common cases
 - Cons:
    - Might be web compat issues, particularly for nested menus constructed this way today

**Option <span>#</span>2 (new CSS property):**
 - Pros:
    - Solves customizable-`<select>`
    - Works for pseudo elements
    - Does not have web compat issues
 - Cons:
    - Might need special care to avoid loops. (`:hover`/`:active` already have this issue anyway, so maybe ok)

**Option <span>#</span>3 (new HTML attribute):**
 - Pros:
    - Solves customizable-`<select>`
    - Does not have web compat issues
 - Cons:
    - Does not work for pseudo elements

**Option <span>#</span>4 (new, non-inheriting :hover-*, etc):**
 - Pros:
    - Solves customizable-`<select>` (with a decently more complicated UA stylesheet)
    - Does not have web compat issues
 - Cons:
    - Significantly more difficult to use. E.g. typical desire is for `:hover` to match all descendants.



-- 
GitHub Notification of comment by mfreed7
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11185#issuecomment-2551909017 using your GitHub account


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

Received on Wednesday, 18 December 2024 17:35:23 UTC