Re: [csswg-drafts] [css-cascade][css-selectors][css-pseudo-elements] How does 'inherit' keyword behave in a child of ::first-line?

I have been thinking and inheritance from `::first-line` for non-inherited properties is so problematic.

Suppose someone has this code, without any explicit `::first-line`.

```html
<div>
  <span>ABCDEFGHIJKLMNOPQR<br />STUVWXYZ</span>
</div>
```
```css
div {
  background: linear-gradient(to right, cyan, yellow 75%, red);
  width: 300px;
}
span {
  background: inherit;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  border: 1px solid blue;
  line-height: 1.5em;
}
```

Then I think most people would expect this

![first-line-1b](https://cloud.githubusercontent.com/assets/7477678/24325021/3a87ab34-1191-11e7-8c9d-be2d07b1fdff.png)

However, if the fragment of the span in the first line inherits the default `background: transparent` from `div::first-line`, then it should be

![first-line-2b](https://cloud.githubusercontent.com/assets/7477678/24325023/44f23256-1191-11e7-9786-aa1d73bc2761.png)

This seems undesirable, and I see three ways to fix it:

1. In a hacky way, like Chrome currently does. Chrome seems to enable the `::first-line` pseudo-element only when it has some valid declaration, whether it applies or not. If `::first-line` is enabled, inheritance is from `::first-line`, otherwise its from the parent element.

    Changing the inheritance like this seems problematic. I just checked and asynchronously adding a new stylesheet with some `::first-line` declaration does not immediately trigger a background repaint.

2. Say that inheritance is always from the parent element for non-inherited properties of the children of `::first-line`, even for properties which apply to `::first-line`. (For inherited properties which apply to `::first-line`, inheritance is from `::first-line`).

    This is what Firefox and Edge seem to do, and even Chrome for some properties like `text-decoration`.

3. Say that inheritance is from `::first-line` for properties that apply to `::first-line`, but that the `inherit` keyword in a child always retrieves the computed value of the parent element, even if the inherited value comes from a pseudo-element.

Currently I don't see any approach to avoid this problem in the specs, I think the csswg should choose some and update the specs.

-- 
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1097#issuecomment-289235855 using your GitHub account

Received on Saturday, 25 March 2017 20:02:36 UTC