About This HTML Issue
The <!DOCTYPE> declaration tells the browser which version and type of HTML the document uses. In HTML5, this is simply <!DOCTYPE html>. According to the HTML specification, the DOCTYPE must be the first thing in the document — before any elements, comments, or whitespace. There can also be only one DOCTYPE per document.
The W3C validator reports “Stray doctype” when it encounters a <!DOCTYPE> declaration in an unexpected location. This typically happens when:
-
The DOCTYPE is accidentally duplicated somewhere in the document (e.g., inside the
<head>or<body>). - Multiple HTML documents have been inadvertently concatenated or pasted together.
- A template engine or build tool is injecting an extra DOCTYPE.
- The DOCTYPE was mistakenly placed after other content, such as a comment, whitespace from a BOM (byte order mark), or a stray character before it.
This matters because a misplaced DOCTYPE can force the browser into quirks mode, which causes it to emulate legacy rendering behavior. In quirks mode, CSS box model calculations, font sizing, and many other layout behaviors differ from standards mode, leading to unpredictable and inconsistent rendering across browsers. A stray DOCTYPE inside the document body is simply ignored, but it signals a structural problem that can also cause accessibility tools and parsers to behave unexpectedly.
To fix the issue:
-
Search your document for all occurrences of
<!DOCTYPEand remove any duplicates. -
Make sure the single remaining
<!DOCTYPE html>is the absolute first thing in the file — no whitespace, no comments, no BOM characters before it. - If you’re using templates or server-side includes, check that only one template is responsible for outputting the DOCTYPE.
Examples
❌ Incorrect: DOCTYPE duplicated inside the body
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<!DOCTYPE html>
<p>Hello, world!</p>
</body>
</html>
The second <!DOCTYPE html> inside the <body> is a stray doctype and will trigger the error.
❌ Incorrect: DOCTYPE appears after other content
<!-- This is my page -->
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Even a comment before the DOCTYPE can cause issues. The DOCTYPE must come first.
❌ Incorrect: Two documents concatenated together
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page One</title>
</head>
<body>
<p>First page content.</p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Two</title>
</head>
<body>
<p>Second page content.</p>
</body>
</html>This often happens when templates are incorrectly assembled. The second DOCTYPE (and entire second document structure) is stray content.
✅ Correct: Single DOCTYPE at the very start
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>
The <!DOCTYPE html> declaration appears exactly once, as the very first thing in the file, followed by the <html> element. This ensures the browser uses standards mode and the document is valid.
Find issues like this automatically
Rocket Validator scans thousands of pages in seconds, detecting HTML issues across your entire site.