<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>1026-element-deep display: table-cell</title> <script> // Any copyright is dedicated to the Public Domain. // http://creativecommons.org/publicdomain/zero/1.0/ function count() { var depth = 0; var deepest = 0; var current = document; var next = null; outer: for (;;) { if ((next = current.firstChild)) { depth++; if (depth > deepest) { deepest = depth; } current = next; continue; } for (;;) { if ((next = current.nextSibling)) { current = next; break; } current = current.parentNode; depth--; if (current == document) { break outer; } } } var h1 = document.getElementsByTagName("h1")[0]; var p = document.createElement("p"); var t = document.createTextNode("Actual depth (including text leaves): " + deepest); p.appendChild(t); h1.parentNode.insertBefore(p, h1.nextSibling); } function deep() { var t = document.createTextNode("PASS"); var div = document.createElement("div"); div.appendChild(t); for (var i = 0; i < 1023; i++) { var another = document.createElement("div"); another.appendChild(div); div = another; } document.body.appendChild(div); count(); } window.addEventListener('DOMContentLoaded', deep, false); </script> <style> div { display: table-cell; } </style> </head> <body> <h1>1026-element-deep display: table-cell</h1> </body> </html>