That is a nice tool you have built there. It is important to remember that people who will be looking at this screen every day are expert users, they will have

That is a nice tool you have built there. It is important to remember that people who will be looking at this screen every day are expert users, they will have dual screen desktops with a mouse, not be fumbling on a phone having not seen the interface before. You did well to make it so they can perfect the information they have on their screen and these efforts will be appreciated in day to day usage. Also it is cool that you have stuck with the semantically correct element in a table. What you can also do with CSS Grid is a table that does not have the extra markup for empty cells, i.e. a sparse table. With some autoflow for the columns and an element name or class setting a column number, you can make a table from other data such as a definition list with the 'display: contents' trick giving grid access to the content in a data definition elements. So you can fully model a contact card for someone using the same markup for pretty contact cards or in the 'table view'. You can also do all of the column reordering without changing the document, the rows or cards can always be written in the same logical order, regardless of whether the columns are rearranged or hidden. There is actually a rendering slowdown with CSS Grid although I have only found this after nesting a few grids and having some transparency on each, going to an older layout technique fixed that. It would be interesting to know if there is a slowdown here, if hundreds of off screen rows are in the document.