Styling H3 links in table cells

Doh, two minutes after saying that I did this…

.tablepress .row-18 a {
color:#6ea432;
border-bottom: 1px dashed;
text-decoration: none;
}

…and that’s worked I think!

It’s the “Click Here For Over ￡700 In FREE Bets!” line I’ve been trying to fix.

I’ll see if I can sort out the hover part myself now too.

Nope, I’m not sure about the hover part.

I tried…

.tablepress .row-18 {
background-color: #ffffff !important;
}

…but that isn’t it and I tried to find it with Firebug, but can’t seem to find it there either.

I’m a dufus. I know.

Please put me out of my misery ??

Hi,

great to see the progress ?? Removing the hover effect just from that line is indeed a little bit tricky. Please try this:

.tablepress .row-hover .row-8:hover td {
  background-color: #ffffff;
}

Regards,
Tobias

I tried that, but it didn’t work Tobias.

Hi,

that’s because you changed my 8 to 19 ?? This row number always is the row number of the row when it is rendered, and not that on the “Edit” screen.
However, I forgot that you are showing the table on different pages, so that this row is not always the 8th row. We’ll need a more dynamic approach then. Please try

.tablepress-id-1 .row-hover tr:last-child:hover td {
  background-color: #ffffff;
}

(I also added the table ID, which I had forgotten previously, so that this would have affected all tables at once…)

Regards,
Tobias

Ah, you’re absolutely right. The full table is on this page with just the last row hidden…

https://racingdatabase.com/free-bets/

…and I was thinking that it should be the last visible row table number.

What you suggested here works perfectly though and dynamic is better!

Thanks again for your help Tobias! ??

Hi,

awesome, great to hear that this worked ??
Yes, with this solution, you won’t even have to adjust the code after inserting more rows ??

Best wishes,
Tobias

Hi Tobias,

I just realised something – when I use this table with an odd amount of rows the last row is automatically styled with the grey color. It’s white when you hover over it now, as per your code above, but is grey before you do.

I tried to adapt your code with this…

.tablepress-id-1 .row tr:last-child td {
background-color: #ffffff;
}

…but that doesn’t fix it.

Could you let me know how to do that please?

Thanks again,

Paul

Hi Paul,

ah right, the code doesn’t account for the alternating row colors. Please try

.tablepress-id-1 .row-hover tr:last-child:hover td,
.tablepress-id-1 tbody tr:last-child td {
  background-color: #ffffff;
}

That should make the last row white all the time.

Regards,
Tobias

That’s perfect Tobias – thanks very much, AGAIN! ??

~ Paul

Hi Paul,

sure, you are very welcome ??

Best wishes,
Tobias