W3C home > Mailing lists > Public > public-css-archive@w3.org > June 2018

[csswg-drafts] [css-ui] consider requiring that descendants do not contribute to outline

From: Cameron McCormack via GitHub <sysbot+gh@w3.org>
Date: Fri, 29 Jun 2018 04:45:22 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-336861642-1530247521-sysbot+gh@w3.org>
heycam has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-ui] consider requiring that descendants do not contribute to outline ==
https://drafts.csswg.org/css-ui-4/#outline-props

Outlines are (intentionally) not required to be a particular shape, but there are some suggestions.  One of those suggestions is that descendant boxes contribute to the outline.  Firefox does this (although not for descendants whose containing block is an ancestor), but Chrome, Edge, and Safari all appear to ignore descendant boxes.

This is a Web compatibility problem for Firefox sometimes, particular when pages use descendants positioned off screen (e.g. with `position: relative; left: -10000px`) to provide text alternatives for elements whose background-image is important.

An uncomplicated test that renders differently in Firefox (the outline surrounds the overflowing content) from other browsers:

http://mcc.id.au/temp/pos-outline.html

```html
<!DOCTYPE html>
<style>
div { background-color: yellow; width: 20px; height: 20px; outline: 1px solid blue; }
</style>
<div>abcdefghijklmnopqrstuvwxyz</div>
```

I think we should consider being a bit stricter about which boxes contribute to an outline.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2846 using your GitHub account
Received on Friday, 29 June 2018 04:45:48 UTC

This archive was generated by hypermail 2.3.1 : Friday, 29 June 2018 04:45:50 UTC