Maximum level of nesting HTML elements

Question

Lets say I have a HTML page like

<div>
  <div>
     <div>
      .....
     </div>
   </div>
</div>

Like above, to what extent we can nest the html elements?

Or in other words, if we make a tree out of the HTML containers of the page, what is the limit on the height of the tree?

Answer 1

There isn't a maximum value in any specifications that I can find. Why not test it out? As noted in the comments the upper limit is probably the amount of memory your browser can consume.

Here's a test jsFiddle.

It creates 1 nested div every 10ms. My browser starts to slow around the 1500 mark.