Using Media Queries for Adaptable Layout

Posted by

Lately I’ve been experimenting with css3 Media Queries for different themes I’ve been working on at work. I decided to give it a shot on my website since the front page uses jQuery Masonry and it was already close to being an adaptable layout on its own. I have been reading up on Media Queries and made a separate style sheet for the elements affected. All it takes is that separate stylesheet, a Javascript fallback for Internet Explorer 8 and less, and a meta tag to reset iPhone viewport & the initial scale. Enough of that; to see it in action, just re-size your browser window to a narrow width back and forth.

Some helpful links discussing this:

http://webdesignerwall.com/tutorials/adaptive-mobile-design-with-css3-media-queries

http://www.alistapart.com/d/responsive-web-design/ex/ex-site-FINAL.html

andreas-ink.com - Jun 19, 2011 | General Musings, News & Updates

Powered by Netfirms