CSS Highlighting Oddness

CSS Highlighting Oddness

RandRand Posts: 2Questions: 0Answers: 0
edited June 2013 in General
From the example I was using the included CSS highlighting. I am very new, so perhaps I am missing something simple, but I was wondering if someone could explain why I am seeing the behavior I am seeing.

(I will shorten the CSS to the first couple of lines from the example just to make the post a little shorter. Imagine I've made the same changes to all of the CSS for the highlighting portion.)

If I use the following CSS, everything works fine:

#mytable tbody tr.even:hover, #mytable tbody tr.even td.highlighted {
background-color: #ECFFB3;
}

#mytable tbody tr.odd:hover, #mytable tbody tr.odd td.highlighted {
background-color: #E6FF99;
}

.....

Now, I didn't think that #mytable was required. I may have several tables on a page, and I'd rather not have the same code several times for each table, so I just removed #mytable.


tbody tr.even:hover, tbody tr.even td.highlighted {
background-color: #ECFFB3;
}

tbody tr.odd:hover, tbody tr.odd td.highlighted {
background-color: #E6FF99;
}

Here is where I am confused. I would expect this to work. Without naming the specific table, the highlighting works.. but not completely. It works for the odd rows, but not the even rows. How does the exact same CSS work for odd rows and not even? I can "hardcode" in the table name(s) but if anyone could explain to me why it highlights the odd rows and not the even rows, I would greatly appreciate it. Thanks.
This discussion has been closed.