Can someone please explain CSS media queries?

Question

I read the article about them over at css3.info, but I didn\'t feel like it explained it well enough. I also could not get their examples to change with my screen size. I at

Answer 1

The rule applied to the screen size means that, citing W3C spec "is usable on screen and handheld devices if the width of the viewport is" in the specified constraints.

http://www.w3.org/TR/css3-mediaqueries/

If you want to adjust the style when the viewport is less than 1024px you can use this rule:

@media screen and (max-width: 1024px) { … }

anyway this rule applies only to the viewport actual size. If you resize the viewport without reloading the page the styles won't be applied.