Adjust tabulator row height

Question

I'm trying to adjust the table row height on a tabulator table. I'm trying to make the rows taller to make it easier to interact with for users on touchscreen devices.

I'm not finding anything in the documentation, and I haven't been successful adjusting the css. What is the proper way to make the rows taller? I'm trying to use Apple's suggestion of a 44px minimum.

Tokyo

Answer 1

You can do this in CSS by adjusting the cell padding, which by default is 4px

.tabulator-row .tabulator-cell{
    padding:8px 4px;
}

Make sure to include this after the tabulator stylesheet

Jetta

If you make padding smaller than 4px, you also might decrease .tabulator-row min.height. – Epitomize

There is a typo in the previous comment, should be "min-height" instead of "min.height". e.g. .tabulator-row { min-height: 20px; } – Sobel