Re: Customize HTML5 forms placeholder style

On 03/20/2010 12:09 AM, Tab Atkins Jr. wrote:
> On Fri, Mar 19, 2010 at 12:59 PM, Aryeh Gregor <Simetrical+w3c@gmail.com> wrote:
>> On Tue, Mar 16, 2010 at 9:59 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
>>> 2) A ::placeholder pseudoelement, which represents the placeholder
>>> text itself.  This pseudoelement only exists when the input is in the
>>> placeholder state.
>>>
>>> . . .
>>>
>>> #2 only addresses the first requirement, but it does not have the
>>> cascading issue that #1 does.  However, it requires us to define what
>>> properties can be applied to ::placeholder.  These would be equivalent
>>> to the properties that can be applied to ::value (defined in CSS3 UI),
>>> but these are not defined yet either.
>>
>> Then if UAs did something like ::placeholder { opacity: 0.6 } in the
>> default stylesheet, rather than ::placeholder { color: darkgray } or
>> such, it would continue to work reasonably even if the author restyled
>> the input without restyling ::placeholder -- right?  Or would an
>> opacity rule not work here for some reason?  (At first I thought yes,
>> then no, now yes again.)
> 
> I *think* that would work.  Assuming that the input was set up such
> that the text color was visible against the background color (not a
> guarantee, but if so then this has a bigger problem than invisible
> placeholder text), then a partially-transparent version of the text
> color should also be visible, only less so, which is the intent.
> Plus, the way opacity works, setting opacity on the input wouldn't
> cause any problems here, as the ::placeholder's opacity would multiply
> with it.
> 
> ~TJ

Even if that may work in most situations, I think forcing the
placeholder to a specific opacity value by the UA is not a good
solution. Indeed, the opacity may work in most situations but with no
doubt, some websites will not use the placeholder attribute because they
will not like the default value. In addition, forcing the placeholder to
a specific opacity value will remove per-platform styling possibility.
For example, we want to have an italic placeholder for Gecko.
I think we can't prevent the placeholder style customization with the
opacity. However, we may specify a specific opacity value as the default
placeholder style but I have an other simple concern against this idea:
opacity is less eye-candy than darkgrey.

By the way, I think the pseudo-element is better than the pseudo-class.

--
Mounir

Received on Saturday, 20 March 2010 00:22:18 UTC