On 5/22/13 11:37 AM, Micky Hulse wrote:
Howdy,I'm in a situation where I would like to use @media all { ... } and @media screen { ... } around blocks of CSS in a large collection of style sheets. Test page using @media all { ... }: <http://jsbin.com/alugiv/1> Test page using @media screen { ... }: <http://jsbin.com/alugiv/2> I've tested in IE6-8 and it appears that those browsers ignore the media queries (or, they follow the rules) and load all styles found within the MQ blocks (and, the cascade does not appear to be affected). Question: My test page is simple, so maybe I'm missing something obvious (or some sort of corner case) ... Is what I'm seeing actually true? Do old IEs not mind @media screen/all { ... } syntax? Where would I go to find official docs that state weather or not this is the case? I'd like to use this on a production site, but I kinda want to confirm that what I'm seeing in my tests is really going to work for me via a live site. :) Can anyone confirm or shed light on official documentation somewhere?
IE 8 does not process media queries, but does process the at-rules that you have in your examples. Your media queries are commented out. So - how did you test? On a screen, I'd expect both sets of CSS to apply. When printing, I'd only expect the "@media all" rules to apply. Did you find something different on printing? On printing your second test page, it identifies as "Mobile" in IE 7 and 8 in my testing, showing the "screen" rules are ignored. P.S. You surround your CSS with HTML comments. That was only needed for the very first browsers. I don't think anyone now uses browsers so old they display the CSS on the screen. :-) -- Cordially, David ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
