[mediaqueries] Add "<" and ">" syntax?

Media Queries currently states that it purposely went with the
min/max- prefix approach for range-type queries specifically to avoid
any issues with the "<" character in HTML/XML syntax.

These characters have no issues in modern <style> elements, though I
suspect they might once have had some, before all browsers recognized
the contents of <style> as plain text.

Thus, it may be time to reconsider this decision.  I believe that the
min/max prefixes are harder to use for authors.  You always have to be
careful with the words "min" and "max", as they can mean opposite
things depending on exactly how you're using them.  For example, the
min() function selects the smaller of its argument, but if you have a
"minimum number", then you take the *larger* of the minimum and the
attempted value.

Instead, I propose we add another syntax possibility to MQs:

(width < 400px)
(device-height > 1000px)
etc

The meaning is the obvious one.  Spaces aren't required around the
characters. You can use "<", ">", "<=", or ">=".

Possibly extensions are to allow values on either side, like:

(400px < width < 800px)

...similar to how Python does, for easier statements of ranges.  This
would make some common practices less fragile and order-dependent.

This idea was independently suggested by the IndieUI group, for
similar usability reasons.

Thoughts?

~TJ

Received on Tuesday, 12 November 2013 08:11:08 UTC