About This HTML Issue
The <base> element must appear before any <link> or <script> elements in the <head> section of the document.
The <base> element sets the base URL and/or default target for all relative URLs in a page. Because <link> and <script> elements often reference external resources using relative URLs, the browser needs to know the base URL before it encounters those elements. If <base> appears after a <link> or <script>, the browser may have already resolved their URLs without the intended base, leading to broken references or unexpected behavior.
Only one <base> element is allowed per document, and the HTML specification requires it to appear before any elements that have attributes accepting URLs. In practice, placing it as the first child of <head> (after <meta charset>) is the simplest way to satisfy this rule.
Invalid example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example</title>
<link rel="stylesheet" href="styles/main.css">
<script src="js/app.js"></script>
<base href="https://example.com/">
</head>
<body>
<p>Hello</p>
</body>
</html>
The <base> element comes after the <link> and <script> elements, which triggers the validation error.
Valid example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<base href="https://example.com/">
<title>Example</title>
<link rel="stylesheet" href="styles/main.css">
<script src="js/app.js"></script>
</head>
<body>
<p>Hello</p>
</body>
</html>
Moving <base> before the <link> and <script> elements fixes the error and ensures all relative URLs resolve correctly.
Find issues like this automatically
Rocket Validator scans thousands of pages in seconds, detecting HTML issues across your entire site.