Question

I have a problem with Chrome. I created a website, the html-code looks like that:

<div id="Content"> 
<h1><span id="back-color">Heading</span></h1> 
<p><span id="back-color">bla bla bla:</span></p> 
  <ul id="bild-liste"> 
    <li><span id="back-color"><a href="?section=Bilder&ID=1">AAAAAA</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=2">BBBBBB</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=3">CCCCCC</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=4">DDDDDD</span></li> 
    <li><span id="back-color"><a href="?section=Bilder&ID=5">EEEEEE</span></li> 
  </ul> 
</div>

The interesting part of my css-stylesheet looks like the following:

#back-color
{
      background-color: white;
}

So I just want the color behind letters to be white. This works quite good in Opera, but when watching the site in Chrome, the background is only white behind the headline and behind “AAAAAA”, but not behind the other elements of the list. That’s quite confusing, because it only doesn’t work in Chrome. Maybe someone has a solution for this problem. thanks!

Answer 1

An id may only be used once on a website. Use css classes instead

(Replace id=”back-color” with class=”back-color” and use .back-color instead of #back-color in your css-stylesheet