Quote from Gaev on June 24, 2019, 3:47 pmI have a requirement to show a lot of table data on the viewer's screen (without the need to scroll) ... so I have to show more rows and columns in the same screen space.
I can control (reduce) the width of columns by using Column Width parameter in neoTableSetColumn .
How can I reduce the height of rows (and the font size of text) ? ... are there CSS classes I can reference ?
I have a requirement to show a lot of table data on the viewer's screen (without the need to scroll) ... so I have to show more rows and columns in the same screen space.
I can control (reduce) the width of columns by using Column Width parameter in neoTableSetColumn .
How can I reduce the height of rows (and the font size of text) ? ... are there CSS classes I can reference ?

Quote from luishp on June 25, 2019, 9:54 amHi @gaev,
Normally the row height is as higher as the content it has.
Anyway, you can style directly any table aspect using html elements in your CSS. For instance:td{font-size:10pt}If you only want to style a neoTable table and not any other one, just use its name as a prefix in CSS. Any neoTable table has an name identical to the Container plus "neoTable". For example if your Container id is "Container1" your neoTable generated table id will be "Container1neoTable"
#Container1neoTable td{font-size:10pt}But i think it is quite better to use the "Subroutine to format the data" in neoTableSetColumn command to change any data visual aspect.
Let me know if you need a sample.Best regards.
Hi @gaev,
Normally the row height is as higher as the content it has.
Anyway, you can style directly any table aspect using html elements in your CSS. For instance:
td{font-size:10pt}
If you only want to style a neoTable table and not any other one, just use its name as a prefix in CSS. Any neoTable table has an name identical to the Container plus "neoTable". For example if your Container id is "Container1" your neoTable generated table id will be "Container1neoTable"
#Container1neoTable td{font-size:10pt}
But i think it is quite better to use the "Subroutine to format the data" in neoTableSetColumn command to change any data visual aspect.
Let me know if you need a sample.
Best regards.
Quote from Gaev on June 25, 2019, 1:07 pm@luishp
#Container1neoTable td{font-size:10pt}
That was my initial thought.
Normally the row height is as higher as the content it has.
Good to know; I was afraid Bootstrap and/or Table-plugin had some special/designated classes for the rows/cells.
But i think it is quite better to use the "Subroutine to format the data" in neoTableSetColumn command to change any data visual aspect.
I'll try both solutions and report any pros/cons of either method.
I should have included this topic in the Tutorial.
Thanks.
#Container1neoTable td{font-size:10pt}
That was my initial thought.
Normally the row height is as higher as the content it has.
Good to know; I was afraid Bootstrap and/or Table-plugin had some special/designated classes for the rows/cells.
But i think it is quite better to use the "Subroutine to format the data" in neoTableSetColumn command to change any data visual aspect.
I'll try both solutions and report any pros/cons of either method.
I should have included this topic in the Tutorial.
Thanks.
Quote from Gaev on June 25, 2019, 7:44 pm@luishp
1) font-size property by itself does not help ... just leaves more white space above/below the text.
2) height property for td elements is no longer supported in HTML5
3) through trial and error, I found that the padding property needed to be reduced ... this worked ...
#myContainerID td { font-size: 10px; padding: 2px; }... and for the Table Header Row ...
#myContainerID thead div { font-size: 10px; font-weight: 100; padding: 0px; }
1) font-size property by itself does not help ... just leaves more white space above/below the text.
2) height property for td elements is no longer supported in HTML5
3) through trial and error, I found that the padding property needed to be reduced ... this worked ...
#myContainerID td {
font-size: 10px;
padding: 2px;
}
... and for the Table Header Row ...
#myContainerID thead div {
font-size: 10px;
font-weight: 100;
padding: 0px;
}