html: hover table column

Question

How can I change the background column of an html table column when the mouse is over it? Preferably with css only.

Accepted Answer

Only works for cells or rows, sorry. e.g.

```
td {
  background-color: blue;
}

td:hover {
  background-color: red;
}
```

There are JavaScript solutions available but nothing in CSS right now will do what you want because of the limitations of selectors.

```
td  /* all cells */
{ 
  background-color: blue;
}

tr /* all rows */
{
  background-color: pink;
}

/* nothing for all columns */
```

Solution