Skip to content

Instantly share code, notes, and snippets.

@stevenocchipinti
Created February 15, 2012 03:40
Show Gist options
  • Save stevenocchipinti/1832996 to your computer and use it in GitHub Desktop.
Save stevenocchipinti/1832996 to your computer and use it in GitHub Desktop.
Nested HTML list browser corrections example
<html>
<head>
<title>Nested HTML list browser corrections example</title>
</head>
<body>
<!--
This page shows that the browser will correct nested <li> elements to be
a flat list of <li> elements in its initial render of the page.
However, if the same elements are inserted with JS after the initial page
load, the list will remain nested and will not be corrected.
-->
<ul>
<li id="bla">
<!-- The HTML on the next line will be corrected by the browser -->
<!-- hi<li>blabla</li> -->
</li>
</ul>
</body>
<script>
// Using JS to insert the same elements the close tags will not be corrected
document.getElementById('bla').innerHTML = "hi<li>blablabla</li>";
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment