Internet Explorer Developer Center >
> 
> 
Comment blocked the stylesheet

Discussion Comment blocked the stylesheet

  • Thursday, July 19, 2012 11:31 AM
     
     
    Sign In to Vote
    0

    I have worked on a PHP based website, the PHP script contains HTML elements and refers to a CSS file as well. After some modification the styles of the elements started to appear and disappear randomly in Internet Explorer 9 (other browsers displayed what I expected).

    I have checked the developer tools and saw that some style properties were present and some were not. After a lot of debugging and modification. At last it turned out I have placed an HTML comment at the start of a PHP file, after I removed it, everything displayed fine.

    I know this wasn't a good idea to place that comment, but I think it should be accepted by Explorer as it is accepted by the other browsers.

     

All Replies

  • Thursday, July 19, 2012 6:03 PM
     
     
    Sign In to Vote
    0

    Hi,

    the w3c standards state that the document type declaration must be the first non-comment tag.

    check your markup syntax for errors by running it through the w3c validators.... validator.w3.org

    to future proof your markup use the html5/system DTD...

    <!doctype html> or <!doctype foo>

    always add a DTD, otherwise only MSIE browsers will use Quirks.

    Rob^_^

     
  • Friday, July 20, 2012 7:47 AM
     
     
    Sign In to Vote
    0

    Hi,

    Right, the first non-comment tag created by the PHP script was the document type declaration. Let me outline this:

    The PHP code uses many PHP template files, these create the HTML document.

    E.g.

    main.tpl.php file:

    <!-- this file is the main comment with iso-8859-1 characters -->

    <?php require_once("heading.tpl.php"); ?>

    ... other PHP and HTML content

    heading.tpl.php file:

    <!-- this file is the heading comment with iso-8859-1 characters -->

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <title>title</title>

    <meta name="viewport" content="width=1000">  

    <link rel="stylesheet" type="text/css" href="css.css">

    ... other HTML content

    This code created the HTML document, but some of the critical css contents were missing. After I removed the comments from the beginning of the PHP files, the critical CSS content miraculously appeared.

    I even successfully validated the edited version of the HTML at the W3 validator with the "bad" comments, and it passed.