On 24 Apr 2012, at 11:49, Duncan Hill wrote: > On Mon, 23 Apr 2012 16:11:58 +0100, Ellen Herzfeld <[email protected]> wrote: > >> My previous message points to the wrong file without the media queries : it >> should be >> >> http://qd.xlii.org/2012/content_modules-ie8.html >> >> By the way, I checked without selectivizr and it doesn't change the problem. >> >> Ellen > > Both this page and the one you posted previously are having problems, I > suspect it is your conditional comments that are preventing load. > Check the syntax, and maybe the logic of how the IE versions are targeted. > > <!--[if ! lt IE 6]><!--> > <link rel="stylesheet" href="/styles/fonts.css" media="all" /> > <link rel="stylesheet" media="all" href="/2012/reset.css" /> > <link rel="stylesheet" media="all" href="/2012/base.css" /> > <link rel="stylesheet" media="all" href="/2012/banner.css" /> > <!--<![endif]--> > > if I read this one correctly, the 'not' operator ! should be directly in > front of the lt, '!lt', however there is a closing of that conditional which > feeds the linked sheets to everything (correctly I guess), then it is > followed by the real closing statement for the conditional. > Perhaps the slight mish-mash is upsetting IE, and isn't [if !lt IE 6] the > equivalent of [if gte IE 6], but in a slightly more convoluted way.
I changed the "! lt IE 6" to "gte IE 6" (you are right, it was a bit convoluted), but it did not resolve the problem. > Similar coding applies for your language declaration, maybe those classes > appear at some stage (class="lt-ie9 lt-ie8 lt-ie7" etc.) but the section: > <!--[if gt IE 8]><!--> > <html lang="fr-FR"> > <!--<![endif]--> > surely just ends up serving <html lang="fr-FR"> to everything. The top conditional comments have nothing to do with the language. They apply classes to the html tag so that fixes can be targeted to specific browsers with these classes. See <paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/> I'm not sure I'll stick with this scheme. Previously I was putting the fixes in a separate stylesheet for each IE. > on XP > IE8 'sometimes' shows the page, but with little styling, into IE7 mode and no > content is visible. > FF 11.0 will not let me switch away from a 'Handheld' media type for the CSS > and is not showing anything like the styling that appeared on your first > posted link. > > on Win7 > IE9 shows as FF, IE8 and IE7 modes show content but move your image from the > right to the left of the page. Yes, I'm sorry but another error creeped in somewhere and really messed everything up. I must have been tired when I did this, but it's now fixed. However this doesn't change my problem with IE7/8. Could you look again, please? The page <http://qd.xlii.org/2012/content_modules.html> should now show styling everywhere (headers and dls centered, image to the right), but in IE 7/8 the spacing between paragraphs is gone and fonts are not correct. In IE7 the headers are bold and sans-serif but too small. In IE8 the headers are not bold, too small and set in a serif font instead of sans-serif. The line-height and top and bottom margins are gone in both. In all other browsers including IE9 there is no problem. On the other page <http://qd.xlii.org/2012/content_modules-ie8.html>, I removed the media queries and respond.js. This way in all browsers (even IE 7/8), what I see is the page styled correctly for wide viewports. Fonts and spacing are good in IE 7 and 8. So the problem has nothing to do with the css itself. With respond.js, the styles in the media queries are obviously seen by IE, but I can't figure out why, in this specific page, there is a problem with typography and spacing. And it really is a very simple page. I'm thinking of just serving a specific desktop stylesheet to IE with a conditional comment if I can't find where the problem is. Or maybe, if this problem is confirmed by others (on this list for example), I'll file a bug for respond.js. Thanks for your help. Ellen ______________________________________________________________________ css-discuss [[email protected]] 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/
