How can I apply some CSS to make tables shrink down a bit? For instance, maybe reduce the font size or the spacing between the row text and the border, or order to fit more rows on the screen without scrolling down. I’ve tried various versions of the CSS below, but it doesn’t seem to do anything.
nx-skootable th td { padding: 2px; }
Question
Shrink table row height
+9
+11How about this?
table.nx-skootable-data tbody .nx-fieldtext{<br> padding: 0px;<br>}
+17- Nintex Employee
Peter, precision of your selectors is going to be the biggest challenge here. If you are not accurate enough, your CSS will be overwritten by the standard styles. Irvin has shown how to successfully remove padding from the field text. There is also padding in the TD (Table Cell). You could use a similar statement as is shown above to remove that.
+9Thanks Irvin, your exmple did shrink the padding down, such that the rows seem to be about 10% or so smaller in height. There’s still whitespace in there that I’d love to control/remove, though, but can’t seem to figure out how. Here’s an example of the html of the page:
31-12-2015
|
+2Hi Peter, were you ever able to figure out a way to shrink table row height down further?
Even with the css above, we’re losing a lot of screen real estate on padding!
+9No, I wasn’t. I do wish that there was an easy way to adjust table/row/cell padding overall. In some cases you want them nice and spaced out and easy to read, but in others you want it pretty dense. Maybe some of this is addressed in the latest (beta) release, since there was mention there about applying styles in a more comprehensive way, but I haven’t looked into that yet.
+2Banzai was great because you can set table cell padding to 0.
However, once you add a Row Action icon, the row height goes too big again. (See related post: https://community.skuid.com/t/make-row-action-icons-smaller.)
Uploading your own row action icon (as suggested in the related post) helps somewhat but not completely.
+17Try putting it in a wrapper. I think what is happening is that the table is trying to fill the container it is currently in. If you put it inside a wrapper with default settings, the wrapper should cause the table to collapse to just the rows displayed
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.