New issue
Advanced search Search tips

Issue 923504 link

Starred by 2 users

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 3
Type: Bug



Sign in to add a comment

outline-style: auto is highlighting pseudo elements

Reported by rose.m...@gmail.com, Jan 18 (4 days ago)

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36

Steps to reproduce the problem:
1. Set `outline-style` to `auto`
2. Set `position` to `relative`
3. Set pseudo element `position` to `absolute`

What is the expected behavior?
It's expected to only outline the base element.

What went wrong?
It outlines the pseudo element.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 71.0.3578.98  Channel: stable
OS Version: OS X 10.14.2
Flash Version: 

- I've created an example showing the bug here: https://codepen.io/mattdrose/pen/OreqYg
- This only happens on `outline-style: auto`, other values work as expected.
- Webkit works as expected—I've tested on Safari 12.0.2 (14606.3.4)
- This is not applicable to Firefox, since outline and pseudo elements works entirely differently (it will outline pseudo elements no matter what the style). This is considered a bug in Firefox by many: https://bugzilla.mozilla.org/show_bug.cgi?id=687311
 

Comment 1 by susan.boorgula@chromium.org, Jan 20 (2 days ago)

Labels: Needs-Triage-M71

Comment 2 by e...@chromium.org, Jan 21 (2 days ago)

Cc: atotic@chromium.org
Labels: -Pri-2 Pri-3
Status: Available (was: Unconfirmed)

Comment 3 by atotic@chromium.org, Yesterday (47 hours ago)

Outline rendering is not defined by css specs, so browsers are free to improvise.
outline: auto rendering has historically been exceptionally incompatible between browsers.
Throw in pseudo-elements, and all bets are off.

csswg has been thinking about making stronger outline rendering recommendations.
csswg working on outline, css-ui-3, would probably love getting developer input on outline use, and why you need interoperability between browsers.

Comment 4 by rose.m...@gmail.com, Yesterday (35 hours ago)

Thanks for the response. I opened an issue with csswg-drafts in hopes they'll make the spec clearer: https://github.com/w3c/csswg-drafts/issues/3539.

I do, however, think that Chrome's behaviour is especially odd. Though different in behaviour, the other browsers are consistent when it comes to the pseudo elements. Chrome is the only browsers that works one way 90% of the time, and differently in unique circumstances.

Comment 5 by rose.m...@gmail.com, Yesterday (35 hours ago)

Also, for what it's worth, I think Safari has it right on this one. Pseudo elements and descendants outside of the elements box model shouldn't be highlighted.

Sign in to add a comment