Are nested HTML comments possible?

HtmlValidationComments

Html Problem Overview


as per the title; is it possible to have nested comments in valid HTML? see the example below...

<p>some text</p>

  <!-- comment 1

    <p>commented out html</p>

    <!-- comment 2

      // are nested html comment allowed?

    end of comment 2 -->

    <p>more commented out html</p>

  end of comment 1 -->
  
<p>some more text</p>

It appears not, does anybody know how I could get nested comments to work?

Html Solutions


Solution 1 - Html

When you nest a comment, replace "--" with "- -". When you un-nest, reverse the procedure. It's not the <!-- that is forbidden but the --.

Example:

<!-- some stuff
<!- - some inner stuff - ->
<!- - a sibling - ->
the footer -->

Solution 2 - Html

TL;DR: Unfortunately, no, it's not possible (and never will be).

Short answer:

An HTML comment is not quite what many think it is. HTML is a form of SGML, in which comments are delimited by pairs of double-dashes (-- … --).

Thus, any pair of a double-dashes inside a pair of angle brackets with an exclamation point after the opening bracket (<! ---- >) is a comment. The spec says it better than I can: http://www.w3.org/TR/html4/intro/sgmltut.html#h-3.2.4

This is why comments like this one (which we've all likely done one time or another) are a bad idea:

<!-- ------------------ HEADER BEGINS HERE -------------------- -->

Truth: I am too lazy to tell you how many comments are represented by the above tag pollution, but it's at least 10.

> I got less lazy: This so-called "comment" actually consists of 10 comments, > three words outside any comment (i.e., just bad SGML), and the > beginning of a comment that is not terminated. It's a real mess: > >

<!--1----2----3----4----5--
> HEADER BEGINS HERE
> --6----7----8----9----10-- -->

Of course, it's not quite that simple, due to differences in how each browser chooses to interpret the spec.

Here's an excellent article that explains it:

    http://weblog.200ok.com.au/2008/01/dashing-into-trouble-why-html-comments.html

Long answer: Why we get it wrong

Most of us who grew up with HTML (without delving into the SGML that underlies it)) have come to believe that the string <!-- begins a comment, and the string --> ends a comment.

Actually, <! and > delimit an SGML declaration within your HTML document, such as the DOCTYPE declaration we've all seen at the top of our pages. Within an SGML declaration, comments are delimited by double-dashes. Thus, the HTML comment

<!-- this is a comment -->

which most of us would believe is parsed like this <!-- this is a comment --> is actually parsed like this:
<!-- this is a comment -->. It is an SGML declaration that is empty except for a comment.

Because HTML is a form of SGML, this "comment-within-a-declaration" functions as an HTML comment.

Out of interest, here's a chunk of pure SGML that shows comments functioning as they were intended in SGML: this attribute list definition contains a comment on each line:

<!ATTLIST LINK
%attrs;                              -- %coreattrs, %i18n, %events --
charset     %Charset;      #IMPLIED  -- char encoding of linked resource --
href        %URI;          #IMPLIED  -- URI for linked resource --
hreflang    %LanguageCode; #IMPLIED  -- language code --
type        %ContentType;  #IMPLIED  -- advisory content type --
rel         %LinkTypes;    #IMPLIED  -- forward link types --
rev         %LinkTypes;    #IMPLIED  -- reverse link types --
media       %MediaDesc;    #IMPLIED  -- for rendering on these media --
>

Solution 3 - Html

If you're really stuck with some piece of HTML – pre-rendered at some uncontrollable source – which contains comments, and you need to make sure none of it is rendered on your page, you can always wrap it with a script tag like below, only thing is, you can't comment out script tags this way.

<p>some text</p>

<!-- multiline "comment" below using script type="text/html" -->
<script type="text/html">

  <p>commented out html</p>

  <!-- comment 2

      // are nested html comment allowed?

    end of comment 2 -->

  <p>more commented out html</p>

</script>

<p>some more text</p>

If you need to comment out script tags, you could use a textarea as wrapper instead, off course doing it this way, you can't comment out textarea tags.

<p>some text</p>

<!-- multiline "comment" below using textarea style="display:none;" -->
<textarea style="display:none;">

  <script>  

    alert("which won't show up..");  

  </script>

  <p>commented out html</p>

  <!-- comment 2

      // are nested html comment allowed?

    end of comment 2 -->

  <p>more commented out html</p>

</textarea>

<p>some more text</p>

Solution 4 - Html

Use template tag. The fastest way to block all the comment and other html from showing up.

<template>
    <!-- first paragraph-->
    Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

    <!-- second paragraph-->
    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</template>

    <!-- third paragraph-->
    Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.sunt in culpa qui officia deserunt mollit.

Solution 5 - Html

It cannot be done. --> will always end an existing HTML comment.

Solution 6 - Html

Nested HTML comments <!-- comment1 <!-- comment2--> --> are NOT allowed.

But you could achieve by using <script> tag and /* */ (Hacky solution):

<script>
/*
  HTML code you want to comment on goes between the Javascript comment section
*/
</script>

Note: Also you could have more than one <script>...</script> pair's in the same HTML file for commenting out the different parts of the code.

Example: Below comments the "Some Statement 2, 3, 4, 5 and 6"

<p> Some Statement 1 </p>

<script>
/*
<p> Some Statement 2 </p>

<!-- explanation about below statement 3 by the comment tag -->
<p> Some Statement 3 </p>

<!-- 
<p> Some Statement 4 </p> 
<p> Some Statement 5 </p>
-->

<p> Some Statement 6 </p>
*/
</script>

<p> Some Statement 7 </p>

Solution 7 - Html

A VS add-in that fakes nested comments by automatically converts <!--...--> to <!~~...~~> then comments out that whole section. It lets you toggle it on and off.

nested-comments

Solution 8 - Html

Some editors have commenting/uncommenting commands which can automatically handle existing comments in a block of text. Visual Studio e.g. is doing that when you press Ctrl+KC and Ctrl+KU.

Solution 9 - Html

try using this

<!-- 

this is the start of the comment

<%-- this is another comment --%>

<%-- this is another one --%>

--> end of the comments.

Solution 10 - Html

Try this

<p>some text</p>
<comment> comment 1
<p>commented out html</p>
<!-- comment 2
  // are nested html comment allowed?
end of comment 2 -->
<p>more commented out html</p>
end of comment 1 </comment>
<p>some more text</p>

Solution 11 - Html

I think it isn't allowed, but as far as I know it works in most of the major browsers except in Firefox.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionQAZView Question on Stackoverflow
Solution 1 - HtmlAaron DigullaView Answer on Stackoverflow
Solution 2 - HtmlDave LandView Answer on Stackoverflow
Solution 3 - HtmlMathijs FlietstraView Answer on Stackoverflow
Solution 4 - HtmlDexterView Answer on Stackoverflow
Solution 5 - HtmlSergioView Answer on Stackoverflow
Solution 6 - HtmlSridharKrithaView Answer on Stackoverflow
Solution 7 - HtmlPaul GorbasView Answer on Stackoverflow
Solution 8 - HtmlDirk VollmarView Answer on Stackoverflow
Solution 9 - HtmldrwView Answer on Stackoverflow
Solution 10 - HtmltxavierView Answer on Stackoverflow
Solution 11 - HtmlTheHippoView Answer on Stackoverflow