Michael Hulse wrote: > Questions: > > 1. Does anyone have a link to an (official) IE7 website/web-page that > talks about this filter?
The official line for IE7 is to follow CSS2 (CSS2.1). Read CSS2.1 about @media: <http://www.w3.org/TR/CSS21/media.html> ...and hope that the IE7-team do the same. > 2. Is this filter an acceptable alternative to conditional comments? It will work well for a limited number of IE/win pre-IE7 styles/corrections. That's what I use it for. It is the combination of an @media rule and the '* html' hack that makes the mentioned filter safe, as IE7 will skip all selectors that starts with '* html' - when in Strict mode, but IE7 will read all other rules inside an @media rule. --- A valid replacement for 'conditional comments': I am ditching conditional comments altogether myself, but the replacement is based on a slightly more complex line of thoughts, and involves the combined use of the '* html' hack and an old IE/win parsing bug. Perfectly valid CSS. Nothing official from Microsoft on that, but I have written it down on my own site: <http://www.gunlaug.no/contents/wd_additions_12.html> ...and the whole site-section makes use of it. > 3. Could someone elaborate a bit more on this statement: > > >> put after all other styles so not to interfere with other @media >> rules if there are any > > > What happens if I do have other @media rules? If I did have other > @media rules, would I just combine them into one @media rule and put > at bottom of CSS? Yes, all styles belonging to the same media, may/should be written inside the same @media rule. I wrap _all_ styles in an @media rule in my stylesheets. That'll keep old browsers from seeing any styles, and I avoid using hacks with similar purpose in my html code. A few stylesheet-filters instead of 400 in-pagehead filters. Makes sense, me thinks. The important thing is to *not* nest @media rules inside one-another, as may happen (by mistake) if there already are @media rules used in a stylesheet. Nested @media rules are non-valid and will make most browsers choke. That's why I wrote that sentence; to make sure those who read it will also get it right. @media rules for different (or even the same) media may be placed after one another in the same stylesheet. You may have: @media screen { /*...all screen styles...*/ } @media print { /*...all print styles.../* } @media projection { /*...all projection styles...*/ } ...and link to one stylesheet instead of having 3 separate stylesheets linked in. Use the proper media="screen,print,projection" on the link, although it will work fine with no media-type set. OTOH: @media handheld { /*...all handheld styles...*/ } ...should be kept in a separate stylesheet and be linked in using the media="handheld". That'll trigger browsers to use it, and the @media rule itself becomes a bit of an overkill in such a stylesheet. The @media handheld rule may come handy for minor page-specific corrections/additions in styles in pagehead though. Small devices for handheld styles usually have limited memory, so it makes sense to make sure they only try to load the purpose-created stylesheet, and don't have to load stylesheets they can't make any use of. --- A more extreme case is @media queries and multi-media rules. Example: @media screen and (min-width: 0px), projection and (min-width: 0px), handheld and (min-width: 0px){ /*... all styles for screens, projection and handheld - if media is wider than zero pixels. */ } ...sounds like a joke, but it is actually a proper rule: <http://www.w3.org/TR/2002/CR-css3-mediaqueries-20020708/> The CSS-validator doesn't seem to be quite happy with it yet and may need some debugging. (I love to kill validators :-) ) Opera-- he only browser that understands 'media queries' at the moment-- is reacting perfect on the above @media rule. --- A trick to use with @media rules for those who still think IE/Mac should get some proper screen-styles: @media screen { /*\*//*/ } /**/ /...all screen styles... } ...will give IE/Mac access to styles inside the @media rule. --- That's it, me thinks. Hope I got all the details right. CSS sure is fun... :-) regards Georg -- http://www.gunlaug.no ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
