Placeholder text color not respected
Categories
(Core :: Layout: Form Controls, defect)
Tracking
()
People
(Reporter: leewhite, Unassigned)
References
Details
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.120 Safari/537.36
Steps to reproduce:
Test CodePen: https://codepen.io/shleewhite/full/WNNxvKP
I tried to increase the color contrast of input placeholder text with
::placeholder {
color: #3e3e3c!important;
}
Actual results:
The color contrast was lowered - presumably because there is an opacity on placeholder text?
Expected results:
The color contrast should have increased, like how Safari, Chrome, and Edge behave.
Updated•5 years ago
|
Comment 1•5 years ago
|
||
Actually I think Chrome (and thus Edge) is going to align with us here: https://www.chromestatus.com/feature/5415963870625792
So this is WONTFIX unless there's a good reason for changing our behavior here in the opposite direction.
Looking at chrome 78, the contrast is still higher on the input with
::placeholder {
color: #3e3e3c!important;
}
because chrome doesn't override my opacity.
Comment 3•5 years ago
|
||
Sure, as you can see in the link from comment 1, that is going to start happening with Chrome 78 (which is not released yet IIUC)
Chrome still wouldn't override my custom color though. Since they use color: rgba(0, 0, 0, 0.54), if I set color: #3e3e3c it will override chrome's 0.54 opacity.
Comment 5•5 years ago
|
||
My point is that in https://bugs.chromium.org/p/chromium/issues/detail?id=932026 they changed color: rgba(.., .54)
to opacity: .54
.
It seems that was going to ship in Chrome 78, but was reverted.
Description
•