About This HTML Issue
An HTML document must have exactly one <body> element. According to the HTML specification, the <body> element represents the content of the document and must appear as the second child of the <html> element, right after <head>. When the browser’s parser encounters content that belongs in the body before seeing an explicit <body> tag, it implicitly opens one. If a <body> tag then appears later in the markup, the parser sees it as a duplicate—hence the error “an element of the same type was already open.”
There are several common causes for this error:
-
Duplicate
<body>tags: A second<body>tag was accidentally typed or left behind after editing or merging templates. -
Content between
</head>and<body>: Placing visible content (like text,<div>, or<script>with content) between the closing</head>tag and the opening<body>tag causes the parser to implicitly open the body, making your explicit<body>tag a duplicate. -
Template or include issues: When using server-side includes, CMS templates, or JavaScript-based frameworks that inject partial HTML, multiple
<body>tags can end up in the final rendered output. -
Misplaced elements inside
<head>: Placing elements that aren’t valid inside<head>(such as<div>,<p>, or<img>) will cause the parser to implicitly close the<head>and open the<body>before you intended.
This matters because a malformed document structure can lead to unpredictable rendering across browsers. While modern browsers are forgiving and will attempt to recover, the implicit body opening may cause elements you intended to be in the <head> (like <meta> or <link> tags placed after the stray content) to end up in the body instead, where they have no effect. This can break stylesheets, SEO metadata, and other head-level functionality. Screen readers and other assistive technologies also rely on correct document structure.
To fix the issue, inspect your full HTML output (not just your templates individually) and make sure there is only one <body> tag. Verify that no visible content or body-level elements appear before it, and that nothing invalid is lurking inside <head>.
Examples
Duplicate <body> tag
This triggers the error because two <body> tags are present:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<h1>Welcome</h1>
</body>
<body>
<p>More content</p>
</body>
</html>
Fixed — combine everything into a single <body>:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<h1>Welcome</h1>
<p>More content</p>
</body>
</html>
Content placed between </head> and <body>
The stray <div> between </head> and <body> implicitly opens the body, making the explicit <body> tag a duplicate:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<div id="banner">Hello</div>
<body>
<p>Main content</p>
</body>
</html>
Fixed — move the <div> inside <body>:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<div id="banner">Hello</div>
<p>Main content</p>
</body>
</html>
Invalid element inside <head>
Placing a <div> inside <head> forces the parser to implicitly open <body>, so the actual <body> tag becomes a duplicate. This also means the <link> tag ends up in the body where it may not work as intended:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
<div>Oops</div>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>Content</p>
</body>
</html>
Fixed — remove the <div> from <head> and place it in <body>:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div>Oops</div>
<p>Content</p>
</body>
</html>Find issues like this automatically
Rocket Validator scans thousands of pages in seconds, detecting HTML issues across your entire site.