how to wordwrap a header in ag-grid

Question

Using ag-grid, is there a way to split a long header across 2 rows...

A break in the columnDefs headerName: 'Long<br />Header' gets me part way there (using dev tools I can see the text has the br), however one of the surrounding elements has a height of 25px; <div class="ag-header" style="height: 25px;"> which I think causes the second line of the header to not be displayed.

I wondered about using group headers as an interim to get the text split, but longer term (when I need to group) that won't be an option...

Answer 1

Try to add the following to your CSS:

.ag-header-cell-label {
    text-overflow: clip;
    overflow: visible;
    white-space: normal;
}

and add this to your grid options:

headerHeight: 48