Make css nth-child() only affect visible

Question

Is there a way to only affect visible elements with this css?

table.grid tr.alt:nth-child(odd)
{
    background:#ebeff4;
}

table.grid tr.alt:nth-child(even)
{
          


        

Answer 1

Another option would be to apply a class to the visible elements when hiding the others. Apply nth-child to this class (which is only applied to the visible elements.)

You don't have to use an !important tag to keep your hover-background in this case.