Turnoff Scrolling within Angular UI ng-grid?

Question

We would like to use the Angular UI ng-grid, but can\'t seem to find an option to tell the viewport within the grid to not set the overflow to auto and not scroll.

W

Answer 1

In your CSS, you can try overriding the height of the div containing the rows, so the rows don't overflow the container:

.ngViewport {
  height: auto !important;
}

You can also fill in the white space that ng-grid leaves for the scrollbar with the row background colour (although unfortunately the data last cell won't expand to fill the gap):

.ngCanvas {
   width: 100% !important;
}
.ngRow {
   width: 100% !important;
}

Depending on your table layout you might need to change some other styles too, but these are the main ones. Also take care not to set a height for the entire ngGrid.