[Solved] Why Can’t You Put content in the element?

Question

The structure your friend proposes violates the global structure of an HTML document; the <body> tag must contain the document’s actual content, whereas the <head> tag must only contain information describing the document.

The
<body> tag permits any flow content within it (such
as <div>):
Whereas the <head> tag is reserved for metadata content
(such as <meta>):
And the <div> element must reside within a parent that accepts flow content:

The incorrect markup will in fact render correctly on the page, because most browsers are actually intelligent enough to know that the markup is incorrect, and correct it themselves. If you inspect the DOM, you’ll find that it has automatically been updated to correctly shift the <div> element (and its content) to within the <body> element (just before <nav>):

Accepted Answer

The structure your friend proposes violates the global structure of an HTML document; the <body> tag must contain the document’s actual content, whereas the <head> tag must only contain information describing the document.

The
<body> tag permits any flow content within it (such
as <div>):
Whereas the <head> tag is reserved for metadata content
(such as <meta>):
And the <div> element must reside within a parent that accepts flow content:

The incorrect markup will in fact render correctly on the page, because most browsers are actually intelligent enough to know that the markup is incorrect, and correct it themselves. If you inspect the DOM, you’ll find that it has automatically been updated to correctly shift the <div> element (and its content) to within the <body> element (just before <nav>):