Chrome automatically disables closing tags
I have the following HTML content to be displayed,
<html>
....
....
<body>
<div class="list-group search-results-container">
<a class="list-group-item" href="/raghav">
<div class="clearfix">
<a class="thumb avatar pull-left m-r">
<img src="/bff63a5c/916c/4d18/841c/58c88c56b65c_cropped.jpg">
</a>
<div class="clear">
<div class="m-t-xs"> Raghav G </div>
</div>
</div>
</a>
</div>
</body>
</html>
I checked the HTML, it doesn't seem to have any errors. But oddly enough, Chrome provides HTML by closing the tag before,
<div class="list-group search-results-container">
<a class="list-group-item" href="/raghav"></a>
<div class="clearfix">
<a class="thumb avatar pull-left m-r"></a>
<img src="/bff63a5c/916c/4d18/841c/58c88c56b65c_cropped.jpg">
<div class="clear">
<div class="m-t-xs"> Raghav G </div>
</div>
</div>
</div>
I also troubleshoot any end tag replacements, but everything closed correctly. Chrome only does it inside this particular<div>
source to share
The HTML5 spec contains information on this:
"... there should be no descendants of interactive content." source
"Interactive content" is described as follows:
"a, audio (if control attribute is present), button, info, insert, iframe, img (if usemap attribute is present), input (if the type attribute is not hidden), keygen, shortcut, menu (if the type attribute is in toolbar state), object (if usemap attribute is present), select, textarea, video (if control attribute is present) " source
In fact, indeed, an element is a
contained div
if it does not contain any of the interactive elements described above. This is confirmed by the first link where the following can be found:
The element can be wrapped around all paragraphs, lists, tables, etc. even entire sections, if they do not contain interactive content (for example, buttons or other links).
source to share