Cornel Urian
Cornel Urian

Reputation: 396

CSS selectors matches more items with the same id

I am using Razor and partial views to create a read email functionality in my MVC project. I am simulating a Tab navigation through my site and at a moment can appear more than one instance of the same view ( content of email that I want to read) as it is shown below.

<div id="MainContainer" class="contentBg">
     <div id="d2773254">
          <div id="divEmail"> .... </div>
     </div>
     <div id="d2342353" style="display:none">
          <div id="divEmail"> .... </div>
     </div>
     ...
</div>

My css selectors use only references to "divEmail" and all children of this div. Problem appear when are more then one HTML items in page that matches the selector.

I also tried to prepend the new div to be the first matched item from the top of the page. It works on 80% of cases, and that's why I'm searching for a solution for this problem. I want to change all of my selectors (add a top level selector $('#divEmail').parent()) to guarantee that HTML element matched is unique.

Is there another solution? Thanks a lot

Upvotes: 1

Views: 140

Answers (1)

ThiefMaster
ThiefMaster

Reputation: 318568

You may not use the same ID twice under any circumstances. So the behavior if you do can be totally random.

In your case use class="divEmail" instead.

Upvotes: 1

Related Questions