</>
ValidateHTML

Duplicate ID Attributes

The id attribute must be unique within a page. When multiple elements share the same id, document.getElementById() only returns the first match. Anchor links (#section) may scroll to the wrong element. CSS ID selectors may not style all instances.

Why It Matters

Duplicate IDs break JavaScript functionality, cause ARIA references to point to wrong elements (breaking screen reader navigation), make anchor links unreliable, and produce invalid HTML that validators flag as errors.

Code Examples

❌ Invalid
<div id="header">Site header</div>
<div id="header">Page header</div>

<label for="email">Email</label>
<input id="email" type="email">
<input id="email" type="text">
✓ Valid
<div id="site-header">Site header</div>
<div id="page-header">Page header</div>

<label for="email">Email</label>
<input id="email" type="email">
<input id="username" type="text">

How to Fix

  • 1Search your HTML for duplicate IDs. Our validator flags them automatically.
  • 2Use more specific ID names (site-header vs page-header).
  • 3Use classes instead of IDs when styling multiple similar elements.
  • 4For JavaScript, use data-* attributes or classes instead of IDs when selecting multiple elements.

Check Your HTML Now

Our validator detects this error automatically and shows the exact line number.

Open HTML Validator
Recommended

Cloudways · Managed Cloud Hosting

Fix this HTML error, then deploy on Cloudways managed cloud (AWS, GCP, DigitalOcean). 20% off 3 months with code VALIDATEHTML.

Start free trial

Related HTML Errors

Unclosed HTML Tag

Learn why unclosed HTML tags break layouts and how to fix them. Find unclosed div, p, span, and other tags with examples.

Incorrect Tag Nesting

Learn the HTML nesting rules: which elements can contain which. Fix p inside p, div inside span, and other nesting errors.

Missing Alt Attribute on Images

Learn why every img element needs an alt attribute and how to write good alt text for accessibility and SEO.

← View all HTML errors