Author Topic: Making ParamQuery Grid More Compact by Reducing Font Size and Row/Column Spacing  (Read 2157 times)

HerrgesellH

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 2
    • View Profile
Hi,

I'm working with large tables that contain a lot of information, and I want to create a more compact display to show more content on the screen at once. Specifically, I'd like to reduce the overall font size and also minimize the space used by columns and rows, while still maintaining auto-sizing functionality.

Currently, if I apply the following CSS to reduce the font size from the default 16px to 12px:

Code: [Select]
.pq-grid {
    font-size: 12px;
}

The text becomes smaller, but the column widths and row heights remain the same, which doesn't achieve the compact layout I'm aiming for.

How can I also shrink the space allocated to columns and rows in proportion to the smaller font? I want the grid to auto-size based on content, but with reduced padding or margins to make it less space-consuming overall.

Thanks in advance and have a great Christmas

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6552
    • View Profile
Thanks for the Christmas wishes, same to you!

row heights can be adjusted with rowHt, rowHtHead options.

Code: [Select]
rowHt: 20
rowHtHead: 20

column widths can be adjusted with column.width, minWidth options.

Also cell paddings can be adjusted with css

Code: [Select]
.pq-grid-cell > div{
  padding: 2px;
}

HerrgesellH

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 2
    • View Profile
Thanks!

It's working fine and also the right size.