Skip to content

[css-pseudo-4] Other properties that should be included #5700

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.

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

Open
tigt opened this issue Nov 6, 2020 · 3 comments
Open

[css-pseudo-4] Other properties that should be included #5700

tigt opened this issue Nov 6, 2020 · 3 comments
Labels

Comments

@tigt
Copy link

tigt commented Nov 6, 2020

https://www.w3.org/TR/css-pseudo-4/#highlight-styling

ISSUE 1 Are there any other properties that should be included here?

Thinking about making ::highlight() work in Contrast-Mode, it seems like the following should be included:

  • outline and its sub-properties
  • border-width, -color, -style, -radius, and the assorted border-image properties
  • padding to support drawing outline/border-* properties further away
  • box-decoration-break (and I would argue for it to default to clone)

There’s also prior art for this in Electron-based text editors, such as this in VS Code: microsoft/vscode#54074

@tabatkins
Copy link
Member

tabatkins commented Nov 7, 2020

We can't include any properties that affect layout, as they'd reveal precisely how the pseudo-element is nested/split relative to the real elements it crosses. Only the tree-abiding pseudos can take those. So border-* and padding-* are both out.

outline and box-decoration-break don't affect layout, but do still reveal where the pseudo is split, so they're out as well, unfortunately.

(That is, if you had markup like <span><em>foo b</em><strong>a</strong></span>r, and you highlighted "bar", how exactly does the element tree look? The ::highlight pseudo clearly has to be split into three pieces, to catch each letter separately. But does it nest inside or outside the strong element? Does the answer change if you highlight just "ar"? There are many questions like this, and working out the full set of answers is terrible drudgework, especially when you have several non-tree-abiding pseudo-elements potentially overlapping as well. And if you take the easy way out and say "it always nests as deeply as possible, with a particular specified ordering", then you get results that probably aren't what people would actually expect, like highlighting "foobar" in fo<em>ob</em>ar producing three elements rather than one.)

@tigt
Copy link
Author

tigt commented Nov 7, 2020

Ah, makes sense. I assumed it was an independent “overlay” element that was on its own topmost plane.

That said, is there a way to handle the High-Contrast use-case you can think of? Maybe I’m missing an obvious answer

@fantasai fantasai added the css-pseudo-4 Current Work label Jan 7, 2021
@samuelbradshaw
Copy link

samuelbradshaw commented Sep 22, 2023

I think I understand the limitation around not affecting layout, but I'm not sure if I completely understand what it means for a style to "reveal where the pseudo-element is split."

Would border-radius (to round the corners of a highlight) be out?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants