Ticket #29175
Question
In my Bootstrap Report, how can I make the columns larger or smaller?
Answer
Informed customer controlling column width can be accomplish with CSS. You have probably noticed that in the application, as you add more/less columns, the column widths always will adjust to try and accommodate taking up the appropriate screen real estate. This is the out of the box functionality these apps have with Bootstrap. An easy way you can adjust column widths manually is to add a CSS style inline to specify the maximum (or minimum) width style for individual columns of your choosing: style="max-width:100px;" or style="min-width:100px;" You may adjust the value accordingly to fit your needs. From the m-Painter toolbar navigate to -> View -> Source -> Edit -> Find -> search for column name (ex 'SZIPCODE') Once you've found the field who's column you want to control, it will be inside of two <th> tags (which stand for table header). Add the inline style like so: <th class="text-left " data-col="SZIPCODE" style="max-width:50px;"> <a class="sort-col" data-field="SZIPCODE" href="javascript:void(0)">Zip Code <i class="fa fa-sort"></i></a> </th> Please keep in mind CSS is not supported over helpdesk, however this is a fairly simply way to control the widths of your columns.
Asked on June 26, 2019