Tuesday, 24 April 2012

Responsive web design example and source code

Anyway...  I recently posted a blog about a building a single page website which used media queries to change layout in real-time between a desktop & mobile format.  Click here to read it.

I few people have contacted me to ask if I would provide a link & source code for the page, so here it is:
Fyi - I've made a couple of changes in the last few days.

Adding a meta tag to enable viewport in mobile browsers
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

Adding a condition to default the layout to desktop if the browser was IE8 or below
<!--[if lte IE 8]>
       <link rel="stylesheet" 
            href="browser-layout.css" 
            type="text/css" />
<![endif]-->

1 comment:

  1. Good example about coding for responsive website. thanks.

    ReplyDelete