Highlight table columns with CSS :has()

Using the new CSS :has() pseudo class, also known as the parent selector, to highlight table columns on hover.

While working with large tables of data, it can often be difficult to scan through all the rows and columns. Without visual styles, pinpointing information at the crossroads of a specific row and column is challenging. One way to assist sighted people in parsing your data is to highlight both the row and column they hover over or tap on, creating a crosshair at that table cell.

Continue reading...