How to make more compact tables

[pxntus]

I use MkDocs with Material as a theme for various documentation projects. It works great and looks good. One of the documentations is a kind of reference with lots of tables. In this specific case the tables are a bit too sparse. It would be good to somehow decrease the table row height to be able to see more without scrolling.

I believe this can be achieved by using an extra.css. I have tried various naive ideas, e.g.:

.tr { height: 14px; }

but without success. Needless to say my CSS skills are very limited... Any advice would be appreciated.

[squidfunk]

You can fiddle with padding, the first value being the horizontal, the second the vertical padding:

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
    padding: 4px 10px;
}