Member Avatar for davy_yg

Hello,

I am trying to fix this bootstrap div id. Is it okay to use it twice?

Please cek this site:

I try to validate: https://validator.w3.org

Error: Duplicate ID row.

From line 90, column 1; to line 90, column 14

↩</div>↩↩↩<div id="row">↩↩<div

Warning: The first occurrence of ID row was here.

From line 62, column 1; to line 62, column 14

enter">↩↩↩<div id="row">↩↩<div

  • 3 Contributors
  • 2 Replies
  • 193 Views
  • 4 Months Discussion Span
  • Latest Post Latest Post by Troy III

Dani AI

Generated

Short answer: don’t reuse the same id in one page. The validator output you posted shows the exact problem hit — two elements both using id="row". is correct: IDs must be unique. is pointing you toward the right idea for layout (Bootstrap uses classes for grid rows), but the root fix is to stop using a duplicate ID.

Why it matters

  • JavaScript that calls document.getElementById('row') will only reliably return the first match, so scripts silently break.
  • Anchor links (#row) will jump to only one element.
  • ARIA attributes that reference IDs become ambiguous for assistive tech.
  • The validator flags it because the HTML spec requires uniqueness.

Practical fixes

  • If the element repeats for layout only, remove the ID and use a class (or the framework’s row class).
  • If you must target each instance individually (for anchors or per-item scripts), give each a distinct ID, e.g. id="blog-row-1", id="blog-row-2", and update any CSS/JS that referenced the old #row. Example pattern:
<section id="blog-row-1" class="blog-section">…</section>
<section id="blog-row-2" class="blog-section">…</section>

<script>
document.querySelectorAll('.blog-section').forEach((el, i) => {
  // per-instance behavior
});
</script>
  • Or use data attributes as stable hooks for scripts: data-section="blog" and select with document.querySelectorAll('[data-section="blog"]').

Quick diagnostics

  • In the browser console you can find duplicates with:
const ids = Array.from(document.querySelectorAll('[id]')).map(e => e.id);
ids.filter((v,i,a) => a.indexOf(v)!==i);

Troubleshooting note: duplicated IDs often come from server-side templates or includes that don’t add a unique suffix inside loops. Fix there, then re-run the validator.

Recommended Answers

All 2 Replies

Member Avatar for pritaeas

Bootstrap uses:

<div class="row">
Member Avatar for Troy III

Of course not. It is never OK to use the same ID for two or more individual subjects in the same global context. But ain't that obvious?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.