Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

respond.js set up tutorial

respond.js set up tutorial

Problem

I cannot find info anywhere on exactly how to setup respond.js.

I unzipped into htdocs - is this correct? Or do I just need respond.min.js in htdocs?

Then simply reference the file like this...

Currently, I have this in my head section, have tried before and after my Media Queries, yet NO stylesheet is used.

Is there a tutorial anyhwere on exactly how to set up resonse.js, as I have no idea if I am doing something wrong or whether there is another problem.

Any help would be much appreciated, my site is FINALLY finished yet I don;t want it to go live without Media queries and currently if I use media queries, no stylseheet is loaded at all in IE8.

Thanks

This is my current code;



    
            

        Eastbourne Netball League[Home] 
Problem courtesy of: C Ivemy

Solution

Alright, since the file is loaded, the problem has to come from one of these 2 points:

From the documentation:

  • Craft your CSS with min/max-width media queries to adapt your layout from mobile (first) all the way up to desktop @media screen and (min-width: 480px){ ...styles for 480px and up go here }

  • Reference the respond.min.js script (1kb min/gzipped) after all of your CSS (the earlier it runs, the greater chance IE users will not see a flash of un-media'd content)

My guess is the second point :)

I hope it helps.

[edit]

    Eastbourne Netball League[Home] 

If this doesn't work, put it this way inside your CSS file:

@media {min-width:600px) and (max-width:1024px) {

    /* your css here */

}

@media {min-width:1025px) {

    /* your css here */

}

Therefore, you can even put all your CSS in the same file

Solution courtesy of: Skwal

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

respond.js set up tutorial

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×