CSS Sprites - same id twice

[stassaf]

Hi,
i'm getting a W3C validation error for:
ID "xx" already defined
these are logos which appear a few times on the same page.

for example:

CSS:
.spMiniLogos {
 background: url(images/Logos/spMiniLogos.png) no-repeat top left;
}
#sRED{ background-position: 0 0; width: 40px; height: 10px;} 
#sBlue{ background-position: 40 0; width: 40px; height: 10px;} 

HTML:
<div class="spMiniLogos" id="sRED"></div>
...
<div class="spMiniLogos" id="sBlue"></div>
....
<div class="spMiniLogos" id="sRED"></div>

so the ID "sRED" appears a few times on the same page and it can't be validated.

i can't create unique ID for each cause it's build dynamically and i don't know how many times the element will appear.

do you have a solution for this issue.

Thanks!
Assaf.

[rainborick]

Whenever you may use a CSS ruleset more than once on a page, it's an indication that you might want to use a class instead of an ID.

CSS:
.spMiniLogos {
background: url(images/Logos/spMiniLogos.png) no-repeat top left;
}
.sRED{ background-position: 0 0; width: 40px; height: 10px;}
.sBlue{ background-position: 40 0; width: 40px; height: 10px;}

HTML:
<div class="spMiniLogos sRED"></div>
...
<div class="spMiniLogos sBlue"></div>
....
<div class="spMiniLogos sRED"></div>

[stassaf]

PEREFCT!
thanks