Cross-browser Media Queries

When creating cross-browser responsive visualizations, you will most likely have to deal with the Media Query support, measurement, and unit issues. The last two can be easily detected and fixed using Modernizr (cssvhunit, cssvmaxunit, cssvminunit, cssvwunit, and more) and fallback solutions.

However, fixing the Media Query support once it is not available is quite tricky. Why is that? If detecting the availability of Media Queries is quite easy (using Modernizr), polyfilling it is a big hassle. The main reason is that Media Queries usually occur in your CSS styles and not in your JavaScript code. Until now, you only learned that JavaScript functions and APIs can be polyfilled using JavaScript. So, if we would want a polyfill for CSS (it has to be written in JavaScript), it always has to parse the complete CSS document to extend its functionality. This means instead of the native styling performance, we will have to parse the CSS using JavaScript, apply all known...