CSS3 Media Queries Facebook Pages Question

[Bruce Whealton]

It was my understanding that Facebook pages that we create as apps, must be 520 px wide or less. I heard that guideline in a course and all that was covered in that course was including sites as Iframes. If one creates a page app using the JavaScript or PHP SDK does this not apply? A later course I am taking which is specifically about building Facebook apps (the first course mentioned covered the broader topic of Social Media Marketing), this newer course doesn't mention constraints on the width at all.

If it was restricted to 520px, could one use media queries to style for 520 px? I didn't know if an iframe with a specified width would force the contained page to that width. I guess it does, as opposed to scrolling the page in the window.

Secondly, regarding media queries, the values I'm seeing used for tablets, don't seem like they work. My iPad has a resolution of 1024 px wide or thereabouts. I think the other dimension is 768 px. So, is there a query for tablets that will work and distinguish between tablets and desktop/laptops?
Thanks,
Bruce

[richelle]

Not sure about the first question since I haven't worked with Facebook page apps myself. As far as the second question. You can use JS to build client side detection load one thing or another. You would also use this to load a higher quality image on devices with the newer retina displays or the web quality image for regular displays. I recently got a book, Implementing Responsive Design that goes into some detail about it. Hope that helps!!