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.

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

[css-highlight-api] Ensuring that the height of ::highlight and ::selection match #8363

Open
fabiospampinato opened this issue Jan 26, 2023 · 3 comments
Labels
css-pseudo-4 Current Work

Comments

@fabiospampinato
Copy link

In the following screenshot taken under Chrome@latest one can see that the height of the dark background set with a ::highlight doesn't match the height of the blue selection:

Screen Shot 2023-01-26 at 21 24 02

Reading the spec I can't figure out if this matches the spec or not.

It looks like a bug to me because it means that one can't quite use ::highlight as a way to render multiple selections, since the height of the two seems to be calculated differently, which seems undesirable.

@Loirooriol
Copy link
Contributor

https://drafts.csswg.org/css-pseudo/#highlight-bounds

For text, the corresponding overlay must cover at least the entire em box and may extend further above/below the em box to the line box edges.

https://drafts.csswg.org/css-highlight-api/#painting

The painting of custom highlights is also handled identically to that of the built-in highlight pseudo-elements, as specified in CSS Pseudo-Elements 4 § 3.4 Area of a Highlight and CSS Pseudo-Elements 4 § 3.6 Painting the Highlight

I guess this allows some highlights to be taller than others, but it doesn't look great.
CC @delan

@Loirooriol Loirooriol added the css-pseudo-4 Current Work label Jan 28, 2023
@delan
Copy link
Contributor

delan commented Jan 29, 2023

I agree. Filed impl bug: https://crbug.com/1411074

@schenney-chromium
Copy link
Contributor

schenney-chromium commented Dec 16, 2023

This is now https://crbug.com/1480139. The WPT test css/css-pseudo/active-selection-031.html fails in part due to the fact that chromium paints selection using a box that extends beyond the em box.

Should we desire to spec this, I would propose that "Custom Highlight background painting should match the overlay painted for selection."

Does anyone have any opinion on this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
css-pseudo-4 Current Work
Projects
None yet
Development

No branches or pull requests

4 participants