CODEWITHSUNDEEP
htmlcssinternet-explorerconditional-comments
buddyp450
buddyp450

Reputation: 572

Using two conditional css if statements uses neither style sheet

At my wit's end here. Trying to implement two different style sheets, one for IE and one for when it's not IE. In every example I've ever seen this is exactly the way you're supposed to do this. Can anyone spot any mistakes in this? Seems like it should be simple enough.

<!--[if !IE]><link rel='stylesheet' type='text/css' href='/login/css/correctlogin.css'/><![endif]-->
<!--[if IE]><link rel='stylesheet' type='text/css' href='/login/css/ielogin.css'/><![endif]-->

Upvotes: 0

Views: 1035

Answers (2)

Scott
Scott

Reputation: 21892

The if not IE statement is redundant. All you need is an if IE statement.

<link rel='stylesheet' type='text/css' href='/login/css/correctlogin.css'/>
<!--[if IE]>
<link rel='stylesheet' type='text/css' href='/login/css/ielogin.css'/>
<![endif]-->

This tells every browser to use correctlogin.css and if the browser is IE, THEN also use ielogin.css

Upvotes: 2

Rob W
Rob W

Reputation: 349052

For the !IE conditional comment, the correct format is <!--[IF !IE]>--> ... <!-- <![endif]-->, because non-IE browsers do not have a special treatment for the conditional comments.

<!--[if !IE]> --><link rel='stylesheet' type='text/css' href='/login/css/correctlogin.css'/><!-- <![endif]-->
<!--[if IE]><link rel='stylesheet' type='text/css' href='/login/css/ielogin.css'/><![endif]-->

See also: http://www.quirksmode.org/css/condcom.html
PS. Conditional comments are not supported in IE10 any more.

Upvotes: 4

Related Questions