Media Queries and Internet Explorer

Media queries, which are part of the CSS3 draft spec, don’t work in Internet Explorer 6, 7 or 8. Hardly surprising, but certainly annoying. So, we need a JavaScript solution.

Css3-mediaqueries.js is a JavaScript library , which makes CSS3 Media Queries work in all browsers. I dowloaded the plugin, but I had no success.

Fortunately I found the following article, http://richardshepherd.com/css-media-queries-jquery/ and downloaded the plugin from there!

Now everything works great, even using Internet Explorer! I will post an example of implementing media queries, when I have some free time:-)

PhotoFluid - fluid layouts and adaptive CSS using Media Queries

ProtoFluid simplifies the development of fluid layouts and adaptive CSS using Media Queries. It works within your website, HTML5 app or game in the form of a single JavaScript include. ( http://protofluid.com/).

All you have to do, is include jquery and photofluid in your head, BEFORE any other javascript.

ProtoFluid does not automatically launch. Type #protoFluid after your web address and refresh the page!

Site Inspiration using Media Queries

http://foodsense.is/

http://foodsense.js in a smaller device

http://www.bostonglobe.com/

 http://www.bostonglobe.com in a smaller device

http://hicksdesign.co.uk/journal/finally-a-fluid-hicksdesign

http://hicksdesign.co.uk/journal/finally-a-fluid-hicksdesign in a smaller devive

You can also checkout http://mediaqueri.es/popular/. The site contains a curated collection of responsive web designs!

So, have a look and get inspired!