You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
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?)
The text was updated successfully, but these errors were encountered:
Can't say we really thought through this one. Referring to ::first-line's set of properties was a spec shortcut, since it seemed like roughly the list of properties we were going for. Seems like it needs a bit more thought.
I am a bit confused at Gecko's behavior, though. Why wouldn't it be aligning to the same baseline as the input text?
Agenda+ to discuss excluding the [css-inline-3] properties from ::placeholder. I can't see that any of them would make sense in an essentially plaintext context, which is where ::placeholder effectively lives.
The CSS Working Group just discussed Should line-height be applicable to ::placeholder?, and agreed to the following:
RESOLVED: CSS inline layout properties are not applied to ::placeholder
The full IRC log of that discussion
<emeyer> Topic: Should line-height be applicable to ::placeholder?
<emeyer> github: https://github.com//issues/5379
<fantasai> -> https://github.com//issues/5379#issuecomment-1367499300
<emeyer> fantasai: Proposal is to exclude CSS inline layout properties from ::placeholder
<emeyer> Rossen_: Objections?
<emeyer> (silence)
<emeyer> RESOLVED: CSS inline layout properties are not applied to ::placeholder
We've run into an interop issue regarding
::placeholder
andline-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:
And checking https://developer.mozilla.org/en-US/docs/Web/CSS/::first-line:
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:
So we check https://drafts.csswg.org/css-pseudo-4/#first-line-styling:
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 implyline-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 thefont
shorthand, so from that point of view it's covered by the first item here.In addition, the spec then goes on to say:
...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 supportsline-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 thefont
shorthand, and for the statement that it supports the same as::first-line
?)The text was updated successfully, but these errors were encountered: