- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Tue, 22 Jan 2013 12:09:28 -0800
- To: Sylvain Galineau <sylvaing@microsoft.com>
- Cc: Mounir Lamouri <mounir@lamouri.fr>, www-style list <www-style@w3.org>
On Tue, Jan 22, 2013 at 11:06 AM, Sylvain Galineau <sylvaing@microsoft.com> wrote: > [Tab Atkins Jr.:] >> Ah, good to see FF switched over! The pseudo-element approach is >> definitely better. >> > Mind elaborating on that assertion? It's been explored in past threads on the matter. Basically, a pseudo-element lets you achieve the intended placeholder appearance in a more reliable way. Assuming standard <input> coloration (black text on white background), we want the placeholder to have gray text. More generally, we want the placeholder to be a lighter, less saturated color than the real text. Using a :placeholder pseudo-class, the best we can do is set the 'color' property itself to the gray we want. This works badly when an author changes the 'background-color' of their input, as the gray may get set against a background-color that produces insufficient contrast. Even if the gray is still sufficient contrast, the author's desired 'color' might not line up with gray. Using a ::placeholder pseudo-element, we can instead set 'opacity' such that it produces the gray we want given typical coloration. If the author changes the input's coloring to use different 'color' and 'background-color' values, it will still do what we want, and produce a lighter, less saturated version of whatever that color is. So, overall, the pseudo-element has a higher chance of maintaining accessibility, and of matching the author's intent. ~TJ
Received on Tuesday, 22 January 2013 20:10:15 UTC