This might seem like more of a graphic design question than a programming questi

Question

This might seem like more of a graphic design question than a programming question, but I think it has much more technical/programming merit than actual graphic design.

The concept of "responsive" web design revolves around using media queries in CSS3 to detect the size of the viewing device and adjust the CSS rules accordingly - essentially, dynamic CSS. This fills the void on a lot of deployment cases - mobile, in particular.

I think use of media queries is surfacing slowly (I've found that many people don't really know about it), but I'm wondering if there is a reason for slow adoption. Is it impractical for web applications? Is there something I'm missing that might be a fundamental pitfall?

Explanation / Answer

You have to jump through hoops to get it to actually work. For a site I'm developing I used @media (max-width:800px) to define a stylesheet for phones and other smaller screens. But it wasn't being used by e.g. iPhone.

Turns out that phone browser developers assume that people won't take small screens into account so they lie to the rendering engine (iPhone claims to be more than 900px wide, for example) unless you put in an extra meta-tag to tell it not to lie. When it gets to the point that you're fighting the browser implementers you start to wonder whether it's worth the effort.

Related Questions

Navigate

• Browse (All)
• Browse T
• Subjects

Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.