[css-d] Conditional CSS Comment Not Working
Greetings Can you tell me what is wrong with the following conditional comments for IE? It appears near the top of my Head for each HTML page, below META tags and Title. The standard css file is overriding the IE6 and IE7 specific versions. For example, if I give the body a green border in the IE6 style sheet, it shows in IE6 only. But if I then add a different colored border to the standard style sheet, it overrides the border specified in the IE6 style sheet. Hope that makes sense. Thanks. code !--[if IE 6] link href=css/avalon_ie6.css rel=stylesheet type=text/css media=screen / ![endif]-- !--[if IE 7] link href=css/avalon_ie7.css rel=stylesheet type=text/css media=screen / ![endif]-- link href=css/avalon.css rel=stylesheet type=text/css media=screen / /code __ 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/
Re: [css-d] Conditional CSS Comment Not Working
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Stan McCoy Sent: Wednesday, August 27, 2008 11:20 AM To: css-d@lists.css-discuss.org Subject: [css-d] Conditional CSS Comment Not Working Greetings - Can you tell me what is wrong with the following conditional comments for IE? It appears near the top of my Head for each HTML page, below META tags and Title. The standard css file is overriding the IE6 and IE7 specific versions. For example, if I give the body a green border in the IE6 style sheet, it shows in IE6 only. But if I then add a different colored border to the standard style sheet, it overrides the border specified in the IE6 style sheet. Hope that makes sense. Thanks. code !--[if IE 6] link href=css/avalon_ie6.css rel=stylesheet type=text/css media=screen / ![endif]-- !--[if IE 7] link href=css/avalon_ie7.css rel=stylesheet type=text/css media=screen / ![endif]-- link href=css/avalon.css rel=stylesheet type=text/css media=screen / /code And properly so. If you want to have a standard sheet and then override settings just for each version of IE the IE conditionals have to come after the standard sheet. Dennis __ 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/
Re: [css-d] Conditional CSS Comment Not Working
On Wed, Aug 27, 2008 at 10:19 AM, Stan McCoy [EMAIL PROTECTED] wrote: The standard css file is overriding the IE6 and IE7 specific versions. For example, if I give the body a green border in the IE6 style sheet, it shows in IE6 only. But if I then add a different colored border to the standard style sheet, it overrides the border specified in the IE6 style sheet. Hope that makes sense. Thanks. !--[if IE 6] link href=css/avalon_ie6.css rel=stylesheet type=text/css media=screen / ![endif]-- !--[if IE 7] link href=css/avalon_ie7.css rel=stylesheet type=text/css media=screen / ![endif]-- link href=css/avalon.css rel=stylesheet type=text/css media=screen / Stan, The rule you specify in your IE6 sheet is overridden by the rule in the avalon sheet because you include avalon.css after the IE sheet. Place that include first, then override with the browser specific sheet. link href=css/avalon.css rel=stylesheet type=text/css media=screen / !--[if IE 6]link href=css/avalon_ie6.css rel=stylesheet type=text/css media=screen /![endif]-- !--[if IE 7]link href=css/avalon_ie7.css rel=stylesheet type=text/css media=screen /![endif]-- --G __ 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/
Re: [css-d] Conditional CSS Comment Not Working
Stan McCoy wrote: !--[if IE 6] link href=css/avalon_ie6.css rel=stylesheet type=text/css media=screen / ![endif]-- !--[if IE 7] link href=css/avalon_ie7.css rel=stylesheet type=text/css media=screen / ![endif]-- link href=css/avalon.css rel=stylesheet type=text/css media=screen / Hi Stan, The order of the style sheets is probably causing you the problem here. Present your default first, then override for IE6/7 like this: link href=css/avalon.css rel=stylesheet type=text/css media=screen / !--[if IE 6]link href=css/avalon_ie6.css rel=stylesheet type=text/css media=screen /![endif]-- !--[if IE 7]link href=css/avalon_ie7.css rel=stylesheet type=text/css media=screen /![endif]-- That should do the trick. Hope it helps. --Bill -- ~~~ TheHolierGrail.com | MacNimble.com | Cyber-Sandbox.com | Anytowne.com Bill Brown, Web Developer - From dot concept to dot com since 1999 The intuitive mind is a sacred gift and the rational mind is a faithful servant. We have created a society that honors the servant and has forgotten the gift. -- Albert Einstein ~~~ __ 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/
Re: [css-d] Conditional CSS Comment Not Working
2008/8/27 Stan McCoy [EMAIL PROTECTED]: Greetings Can you tell me what is wrong with the following conditional comments for IE? It appears near the top of my Head for each HTML page, below META tags and Title. The standard css file is overriding the IE6 and IE7 specific versions. Hi Stan, the order of conditional comments and standard CSS is wrong. As the IE6 and IE7 stylesheets shall override certain rules of your standard stylesheet, they have to be added AFTER your standards stylesheet. (This is part of the C in CSS: http://www.w3.org/TR/REC-CSS2/cascade.html ) Cheers, jens -- Jens Brueckmann http://www.yalf.de __ 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/
