Skip to main content
Nintex Community Menu Bar

Allow line breaks in table headers

  • July 8, 2024
  • 7 replies
  • 57 views

Forum|alt.badge.img+9

If I put a return/line break in a field custom label, and show that field in a field editor, it seems to work as desired - the field label is rendered with a line break in it. However, when I do this with a table, the line break is not rendered at all; The two lines just get smushed together on the same line. Since some of my table’s field names are long, and I can’t set the width of the column myself, I’d like to get the the field titles in the header to stack vertically to make appropriate room on the page.

This topic has been closed for replies.

7 replies

Forum|alt.badge.img+1

Peter…

Did you ever figure out how to do this? I have the same issue and I don’t know how to resolve.


Forum|alt.badge.img+17
  • Nintex Employee
  • July 8, 2024

You can override the CSS class for table headers and get a Wrapped Lable effect.  However there are some strange interactions between the column width properties that this introduces. 

Add a resource of type CSS and add this code: 

th {white-space: normal;vertical-align: top;}

This should get you started. 


Forum|alt.badge.img+6

Has this ever been fixed?  It would be nice to allow line breaks in Field Properties / Custom Label labels so the table does not grow so wide. 


Forum|alt.badge.img+17
  • Nintex Employee
  • July 8, 2024

This is still not possible declaratively - but very simple to obtain with the CSS I provided in May. 


Forum|alt.badge.img+3

I have had such a request today. Throwing my name into the fish bowl


Forum|alt.badge.img+3

Thanks Rob - I needed this too and it worked. Nicholas


Forum|alt.badge.img+6
  • Nintex Employee
  • July 8, 2024

Until we provide a declarative solution, please use the following CSS to achieve this effect. (Some of the suggestions below are now out of date and may not work as expected.)

th<br />{<br />&nbsp; &nbsp; vertical-align: top;<br />}<br /><br />th &gt; span<br />{<br />&nbsp; &nbsp; display: inline-block;<br />&nbsp; &nbsp; white-space: normal;<br />}