styling <meter>

Simple question: is <meter> element [1] styleable by CSS in 

The <meter> can be in low/high/optimum states and
for CSS purposes it is desirable to reflect somehow these
states as :flags or [attributes] so CSS selectors can be used
to define at least something. 

Otherwise authors will not be motivated to use <meter> where
it is really needed. 

And yet, all UAs that support <meter> now render it 
very close to <progress> which is IMO misleading. 

There are other elements and input widgets that have their
own states that should be styleable.

I suspect that the easiest way to add reflection of inner state 
to CSS is to use special state-*** attributes that will be 
ideologically close to data-*** attributes that we have already.
So for the <meter> we will be able to define something like 
  meter[state-meter="low"] { background-color: yellow; }
  meter[state-meter="optimal"] { background-color: green; }
and meter implementation is responsible for setting this attribute.


Andrew Fedoniouk

Received on Tuesday, 13 September 2011 04:01:45 UTC