Generalized use of "odd" and "even"

edited September 2012 in Style Development
I'm trying to soften ebay's horrid all-white scheme by alternating table background colors. I noticed that ebay puts its search results items each in its own table containing the identifier r="n", where n is an incrementing number. Here's one example:

<table r="1" class="li rsittlref" itemprop="offers" itemscope itemtype="">

Over at it states that the nth-child pseudo class can be used by the css to calculate whether a class identifier fits or not. But can one use this with that r value? This is beyond me.



  • Wouldn't it be easier to just use .li.rsittlref ?
    See if this helps:
  • That's a nice style, but it doesn't alternate rows (which are actually tables).
  • You can use this:
    /* Odd */ .rsittlref { background:red!important; } /* Even */ .rsittlref:-moz-any([r$="0"], [r$="2"], [r$="4"], [r$="6"], [r$="8"]) { background:blue!important; }
    It works like this:
    First it colors every table red. Then it colors all tables whose r value ends with an even digit (which means that the r value is even) blue.
  • Wow, that is good. I didn't know if the quotes around the r number would throw it, and if the css would pick up the ongoing even pattern.

    Thanks very much!
  • @namespace url(; @-moz-document domain("") { #ResultSetItems > TABLE:nth-of-type(odd) {background-color:lightblue} #ResultSetItems > TABLE:nth-of-type(even) {background-color:lightpink} }
    (Worked with these search results, anyway.)
  • Thanks! That works too. Amazing how it can pick up the r number even without it being specified?
  • It can't. It's numbering the TABLE elements in the containing element, and coloring the TABLE differently when that count is odd.
  • A ha. Thanks. Neither method seems to be working in opera though.
  • Odd; it works for me. You did remove the @document wrapper and reload the page after you set the site style, yes?
  • Yes. Puzzling.
Sign In or Register to comment.