sIFR element with class

Question

I'm having difficulty with sIFR 3. I am creating some pagination. I would like the element with an 'active' class to be a different color. This is not working. The rest of the code is working fine including the rollover color.

Here's my code. If anything is out of place please let me know.

sIFR.replace(uni, {
  selector: 'div.pag_holder',
  css: [
    '.sIFR-root { background-color: #DEDEDE; }'
    ,'a.active { color:#000000; }'
    ,'a { text-decoration:none; color:#1c4382; }'
    ,'a:hover { cursor:pointer; color:#000000; }'
    ]
});

I've tried playing around with the order of those anchors, but to no avail.

Answer 1

We had a similar problem where sIFR doesn't implement the value given in a class when the element style has also been specified. The answer was to use two classes for the anchor element. So you could try:

sIFR.replace(uni, {
  selector: 'div.pag_holder',
  css: [
    '.sIFR-root { background-color: #DEDEDE; }'
    ,'.navLinkActive { color:#000000; }'
    ,'.navLink { text-decoration:none; color:#1c4382; }'
    ,'a:hover { cursor:pointer; color:#000000; }'
    ]
});

Hope this helps.