Styling :placeholder-shown does not work interoperably #8
Description
Describe the issue
Trying to use :placeholder-shown to truncate placeholder text mostly works for input elements (though only Firefox shows a color change). Using it on a textarea does not work at all for truncation, and browsers disagree on which rules they apply.
Technologies Involved
CSS Selectors https://drafts.csswg.org/selectors/#placeholder
Browsers Tested
Mac Firefox, Edge, Safari
Testcase
https://codepen.io/astearns/pen/OJgGmNz
Screenshots
Mac Firefox 92, input element on top, textarea element below
Here white-space:nowrap does not apply. Since that does not, it can’t be determined whether text-overflow:ellipsis would have an effect
Mac Edge 94, input element on top, textarea element below
Here white-space: nowrap does apply, but color and text-overflow: ellipsis do not
(Chrome and Safari are similar to Edge)
Additional context
w3c/csswg-drafts#6669
https://bugzilla.mozilla.org/show_bug.cgi?id=1732267