Summary:
Hi,
In bug 315209 I landed a patch to get outlines to follow the
border-radius of the element automatically. It should be enabled in
Nightly for now.
There's some (a lot) of context in the bug, but TLDR:
* Long-standing request.
* Safari does this for outline-style: auto, and we will too, with the
new non-native theme, so it seems like being consistent would be worth it.
* We have -moz-outline-radius to control the outline radius, but
authors don't use it, and that makes outlines look worse, generally. It
is also not standard, so it'd be great to get rid of it eventually.
Pref: layout.css.outline-follows-border-radius.enabled
Standard:
https://drafts.csswg.org/css-ui-4/#outline-color
> The parts of the outline are not required to be rectangular. To the
extent that the outline follows the border edge, it should follow the
border-radius curve.
DevTools bug: N/A, I think.
Other browsers:
* Safari: Shipped (for auto-style outlines) since ~forever.
* Chromium: N/A, though they have an slightly rounded auto-style outline.
web-platform-tests: I can upstream a couple of the existing reftests
that we had for outline-radius etc to WPT.
Cheers,
-- Emilio