[csswg-drafts] [css-pseudo-4] Should `line-height` be applicable to `::placeholder`? (#5379)

jfkthame has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-pseudo-4] Should `line-height` be applicable to `::placeholder`? ==
We've run into an interop issue regarding `::placeholder` and `line-height`, and would like to clarify what is expected/correct behavior.

From https://bugzilla.mozilla.org/show_bug.cgi?id=1656279, with minor edits:

AFAICS, it looks like Blink and Webkit don't apply `line-height` to the `::placeholder` pseudo, whereas Gecko does.

Who's right?

According to https://developer.mozilla.org/en-US/docs/Web/CSS/::placeholder:
> Only the subset of CSS properties that apply to the ::first-line pseudo-element can be used in a rule using ::placeholder in its selector.

And checking https://developer.mozilla.org/en-US/docs/Web/CSS/::first-line:
> Only a small subset of CSS properties can be used with the ::first-line pseudo-element:
> ...
> * word-spacing, letter-spacing, text-decoration, text-transform, and line-height

So MDN thinks `line-height` should work. But trying to confirm this in the W3C specs:

Starting at https://drafts.csswg.org/css-pseudo-4/#placeholder-pseudo:
> All properties that apply to the ::first-line pseudo-element also apply to the ::placeholder pseudo-element.

So we check https://drafts.csswg.org/css-pseudo-4/#first-line-styling:
> The ::first-line pseudo-element’s generated box behaves similar to that of an inline-level element, but with certain restrictions. The following CSS properties apply to a ::first-line pseudo-element:
> *   all font properties (see [CSS-FONTS-3])
> *   the color and opacity properties (see [CSS-COLOR-3])
> *   all background properties (see [CSS-BACKGROUNDS-3])
> *   any typesetting properties that apply to inline elements (see [CSS-TEXT-3])
> *   all text decoration properties (see [CSS-TEXT-DECOR-3])
> *   the ruby-position property (see [CSS-RUBY-1])
> *   any inline layout properties that apply to inline elements (see [CSS-INLINE-3])
> *   any other properties defined to apply to ::first-line by their respective specifications 

AFAICT this does *not* include `line-height`, which isn't defined in any of the specs mentioned; it's still defined by CSS2 at https://www.w3.org/TR/CSS2/visudet.html#propdef-line-height. So that seems to imply `line-height` should not be supported.

I do wonder if this is an oversight, though, given that `line-height` can also be set as part of the `font` shorthand, so from that point of view it's covered by the first item here.

In addition, the spec then goes on to say:

> User agents may apply other properties as well. 

...which leaves things wide open! (But not interoperable.)

Interestingly, a quick test indicates that both Chrome and Safari *do* support `line-height` on `::first-line`; so we might reasonably expect it to work on `::placeholder` as well. Given the behavior of `::first-line` (where everyone supports `line-height`), and the fact that the spec says `::placeholder` supports the same properties, I feel like what Gecko is doing is arguably more correct.

What's the CSS WG opinion here? Should we file bugs against Webkit and Blink, and would they consider changing behavior, or should the spec be changed to explicitly exclude `line-height` from the properties supported on `::placeholder`? (And if so, what does that mean for the `font` shorthand, and for the statement that it supports the same as `::first-line`?)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5379 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 31 July 2020 22:11:43 UTC