1

I am working on a concept with Angular UI-Grid where we will have several columns pinned to the left and need to customize the height of the cells. I am easily able to modify the height of a cell but find that the height is not applied to the non-pinned cells. Anyone have any suggestions on how to accomplish this?

Updated Based on comments I was able to get this working for fixed height columns using rowHeight option, now working on dynamic row height and word wrapping across. T

CSS used to get dynamic height and word wrapping but this isn't working across pinned columns.

[ui-grid-row] {
    display: table-row;
}

.ui-grid-row, .ui-grid-cell {
    height: auto!important;
}

.ui-grid-cell {
    float: none;
    display: table-cell;
}

.ui-grid-header-cell, .ui-grid-cell-contents {
    white-space: normal;
    padding: 2px;
    word-break: break-word;
}
Justin Isenhour
  • 11
  • 2
  • The only thing I did was set gridOptions.rowHeight to the desired rowheight. This applies to both pinned and non-pinned cells.Check [this plunker](http://plnkr.co/edit/jI1dDXwlqKXzZifFbXWE?p=preview). Please include some code in your question, if this is not working for you. – Remko May 13 '19 at 04:59
  • Ok, adding rowHeight option works for fixed height across pinned columns. Next step is to have dynamic column height. For one use case the column height may change depending on the external options selected. I was able to get this working by modifying the CSS to enable 100% height and word wrapping but this approach doesn't work across pinned columns. – Justin Isenhour May 13 '19 at 05:27
  • Changing gridProperties.rowHeight will result in an adjustment of the current rowHeight, albeit for all rows at once, not on a per row basis. I don't think that would be possible using ui-grid. I updated the [plunker](http://plnkr.co/edit/jI1dDXwlqKXzZifFbXWE?p=preview). – Remko May 13 '19 at 07:01

0 Answers0