Open umashankar5544 opened 5 years ago
problem with expand collapse button- Using dynamic row height in angular UI-grid, each row takes height according to its content, but expand/collapse column is not aligned with corresponding row. My requirement is to get it aligned with its corresponding row. If that requirement is done the Grid will be intact with browser, when ever browser is resized. Any suggestion on how to get this to work? Thanks.
these are the styles i have used .ui-grid-cell-contents for content under each cell
.ui-grid-row, .ui-grid-cell { height: auto !important; } .ui-grid-row div[role=row] { display: flex ; align-content: stretch; } .ui-grid-viewport { word-wrap: break-word; white-space: normal !important; } .ui-grid-cell-contents { padding:5px; box-sizing: border-box; font-size: 14px; display: flex; align-items: center; white-space:normal !important; word-wrap: break-word !important; }
rowHeight is specified 'auto' in GridOptions
$scope.productGridOptions = { data : 'Details', rowHeight: 'auto', columnDefs : [ { }, . . . ]
};
Did you find the fix?
problem with expand collapse button- Using dynamic row height in angular UI-grid, each row takes height according to its content, but expand/collapse column is not aligned with corresponding row. My requirement is to get it aligned with its corresponding row. If that requirement is done the Grid will be intact with browser, when ever browser is resized. Any suggestion on how to get this to work? Thanks.
these are the styles i have used .ui-grid-cell-contents for content under each cell
rowHeight is specified 'auto' in GridOptions
$scope.productGridOptions = { data : 'Details',
rowHeight: 'auto', columnDefs : [ { }, . . . ]
};