[css3-meadiaqueries] Proposal for "content-width" and "content-height" media features

To whom it may concern

Current W3C Recommendation document about CSS3 media
queries<http://www.w3.org/TR/css3-mediaqueries>defines
*width* (and *height*) and *device-width* (and *device-height*) media
features. Let's focused on the former and see why it's problematic and how
it could be solved.

*The problem*
*Width* and *height* ("these" from now on) media features gives responsive
web designers/developers the possibility to adjust content to available
space. The problem is they don't get pixel-accurate control as these media
features also include scrollbars which can vastly differ in their size over
different browsers and operating systems. Touch devices usually don't even
display a permanent scrollbar on scrollable content. All these differences
mean that there is no reliable to efficiently control the amount of
available space to designers/developers. The usual approach to applying
media queries is to apply some safety space which can be occupied by a
scrollbar when displayed. This means that for non-fluid layout we can't use
the whole space which becomes even more apparent when there're no
scrollbars as on touch devices that usually already have less space to
start with.

*The proposed solution*
I would like to propose additional media features *content-width* and *
content-height* that only account for actual available space not including
scrollbars when they're displayed on root element. This would give
designers/developers exact control of available space and they could use it
accurately down to a single pixel. As scrollbars would be excluded from
these values it would make it browser and OS independent and always correct.

*Example*
This is an example of a CSS media query:

@media screen and (max-content-width: 320px) {
    ...
}


*Alternative solution*
As W3C Recommendation describes, media queries syntax could include complex
expressions:

> Properties may accept more complex values, e.g., calculations that involve
> several other values.


If there was additional media feature *scrollbar-width* (and *
scrollbar-height*) available content space could as well be accurately
calculated.

Kind regards,
Robert Koritnik
*Pleiado d.o.o.*
Developer/consultant on Microsoft platforms and technologies
*mobile* +386 41 322 735
*skype* +44 20 71 93 08 46
*skype* robert.koritnik
*twitter* @robertkoritnik <http://twitter.com/robertkoritnik>
*google+* Robert Koritnik <https://plus.google.com/116164717430356367649>
*linkedin* Robert Koritnik <http://www.linkedin.com/in/robertkoritnik>
*blog* Erratic software development <http://erraticdev.blogspot.com>

Received on Wednesday, 9 October 2013 11:59:47 UTC