Justin
Justin

Reputation: 5069

Conditional Comments and Valid XHTML

Given the code (which looks like it should be valid):

<!--[if lt IE 7]> <style type="text/css" media="screen">
<!--
div.stuff { background-image: none; }
--></style><![endif]-->

The W3C validator throws a fit:

etc etc

I'm not totally sure whats going on. Is it the 'nested' comments? The tag is being generated by the Zend Framework Viewhelper headStyle

$this->headStyle()->prependStyle('div.stuff { background-image: none; }',
                                 array('conditional' => 'lt IE 7')
                                );

Upvotes: 4

Views: 1970

Answers (6)

Sildoreth
Sildoreth

Reputation: 1935

The answer given by Phil Booth is correct in that your HTML comment syntax is incorrect; HTML comments cannot be nested. However, I'd like to take it a step further...

You should not use HTML comments to hide your CSS or JavaScript from XHTML validation. Instead, you should use CDATA tags. This is the most universal solution, supporting pretty much every browser and browser version new and old.

<head>
  <style type="text/css">
    /* <![CDATA[ */
    div.stuff { background-image: none; }
    /* ]]> */
  </style>
  <script type="text/javascript">
    /* <![CDATA[ */
    function myFunction() {
    }
    /* ]]> */
  </script>
</head>

These articles go into more detail about why the aforementioned solution is the correct one:

Upvotes: 0

Tom&#225;š Fejfar
Tom&#225;š Fejfar

Reputation: 11217

You should post new issue on issue tracker. It's a good way to make such mistakes corrected. http://framework.zend.com/issues/secure/Dashboard.jspa

Upvotes: 0

grawity_u1686
grawity_u1686

Reputation: 16562

...and why comment out the entire contents of <style>? It's not as if you're coding for a browser that is dumb enough to display it. (Even command-line browsers hide the style/script blocks.)

Edit: Ah, wait. That's generated by Zend.

Upvotes: 0

Vincent Ramdhanie
Vincent Ramdhanie

Reputation: 103145

It is the nested comments. They are not allowed.

Upvotes: 2

Phil Booth
Phil Booth

Reputation: 4913

"-->" closes any comment, there is no notion of nesting comments inside each other. So in your code, the first "-->" closes both of your comments. Then the <![endif]--> is completely outside of any comments, so doesn't make any sense.

Upvotes: 6

Welbog
Welbog

Reputation: 60438

You can't have a -- inside of a comment unless it's part of the --> ending in valid XML/XHTML. Just the way comments work.

From this source:

For Compatibility, the string "--" (double-hyphen) MUST NOT occur within comments.

You should find a more standard way to differentiate between browsers (or, more ideally, have a layout that doesn't require differentiation between browsers at all).

Upvotes: 7

Related Questions