Device queries match only the screen configuration.
‘width’ and ‘height’ are not the same as the ‘device-width’ and ‘device-height’ queries.
You can always prototype with ‘width’ in ProtoFluid then switch to ‘device-width’ on launch if this is preferred.
Introductory articles explaining the benefits of this method are available via Smashing Magazine.
Option 1. Specify the Media Query dependent CSS to load in the HTML.
<link href='css/480.css' media='only screen and (max-width: 480px)' rel='stylesheet' type='text/css'>
Option 2. Specify the Media Queries directly in the CSS itself.
@media only screen and (max-width: 768px) { }
@media only screen and (min-width: 480px) { }
The ‘orientation’ Media Query facilitates portrait and landscape dependent styling.
@media (orientation: portrait) { }
@media (orientation: landscape) { }