respond.js or css3-mediaqueries.js ?
The official documentation, especially that of css3-mediaqueries.js, is sparse. Reading on SO, forums and blogs I have summarized these pros and cons.
Pros:
<link>
, inline CSS, @import-ed CSS)Cons:
min-width
and max-width
em
units (huge weak point!)Pros:
em
units (really? anyone tested it?)Cons:
Does anyone have points to add to the list, or personal experiences to share, or a particular preference for one or the other script? If so, why?
I created a test page, including Mediatizr too.
If anyone is interested, here's the test page, and these are the results (tested on IE8 and IE7).
min
, max
and min+max
mediaqueriespx
and em
values<style>
) and external stylesheetswidth
mediaquery<link media="screen and ...">
nor @import
ed stylesheetmin
, max
and min+max
mediaqueriespx
and em
valueswidth
mediaquery<link media="screen and ...">
nor @import
ed stylesheetson load
events, to solve it you need to place the script at the end of the pageSimply..doesn't work
In the end I opted for css-mediaqueries.js, conditionally loaded with Modernizr.