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...
Set the header height to zero.
In your data rows: you have to enter in the first column the title you want for each row. Show activity on this post. Add this as your first colDef . It will render a index column that is unmovable.
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With