Style row or column rather than cells when border-collapse: separate
css, html, html-table
Solution
If you use constant row width, you can use `colspan` to merge all cells of some row into one single cell, and then create a new table in it with separate borders with the background color of your choice.
Problem
I have a table which for other reasons I prefer to keep table-collapse: separate. However, I would like to be able to highlight an individual row or column. Unfortunately, it seems that any style applied to the `<tr>` or `<col>` tags only applies to the cells, not the space between them. For instance: ``` <style> td { width: 10px; height: 10px; } </style> <table style="background-color: purple"> <colgroup> <col span="2"> <col style="background-color: red;"> <col span="2"> <colgroup> <tr><td><td><td><td><td></tr> <tr><td><td><td><td><td></tr> <tr style="background-color: orange;"><td><td><td><td><td></tr> <tr><td><td><td><td><td></tr> <tr><td><td><td><td><td></tr> </table> ``` results in a purple table with 5 vertical cells and 5 horizontal cells filled with color but not the entire row or column. Do I have any option besides using border-collapse: collapse to fill in that space between cells in a given row or column?