Skip to main content

Can it be possible to wrap the header names in the webui tabel widget?

Especially when the data itself has not that many characters, I prefer the header to be wrapped instead of making the column wider. And is it possible to turn the header direction (from top to bottom for example?

 

Hi @Kai,

 

We have this feature on our backlog for Table Improvements. It might be a while before we introduce changes to the table. In the meanwhile, you can try this CSS trick that will help achieve the same result.

.tag-table .colheader-viewport tr .cell>div label, .tag-table .rowheader-viewport tr .cell>div label{
display: -webkit-box !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
white-space: normal;
word-wrap: break-word;
}

 webkit-line-clamp is basically the number of lines you want before the ellipsis on the text. Please let me know if this works for you. So you can change this from 2 to 3 if required.

You can also experiment with word-wrap . This attribute breaks a long word into two lines(or more depending on the space).

 

Hope this helps! Here is an example with the above style:

 

Thanks,

Pratap


Updated idea status NewOn Backlog

Hi @Pratap Kumble ,

Thanks for this idea, I have been using this for a while now. But just noticed a bug that I get if I implement this, see the picture below. The table headers don’t align with the data (‘Capability check’ in this overview) anymore. But is corrected somehow at the bottom of the table

 

 


And now for the question: do you know how to solve this?


@Pratap Kumble do you have an idea about this?


Hey all! This has been implemented! See more here: https://documentation.aimms.com/webui/webui/table-widget.html#special-settings


On BacklogImplemented

Didn't find what you were looking for? Try searching on our documentation pages:

AIMMS Developer & PRO | AIMMS How-To | AIMMS SC Navigator