1px padding-top on ui-grid-canvas

[ghost]

1px padding was added to the top of the ui-grid-cavas in https://github.com/angular-ui/ng-grid/commit/040a5ee1acc1fdeda6a466fbe05d242f8775ef18. When you scroll the grids viewport to the top there is a 1px gap between the headers and the start of the grids rows.

It's not very noticeable with the grids default styles but if you change them, specifically if you make the cell borders a dark colour, the gap is very apparent.

[c0bra]

Yea I think that was necessary. @swalters do you recall why?

[PaulL1]

@swalters: allocating to you, I seem to recall a conversation about this in the past about why it was necessary, in which case I think we push this forward into the future as an enhancement request.

[boroth]

I noticed this as well, and upon setting some custom CSS to set the padding to 0, it breaks virtualization/scrolling. Specifically, when you scroll all the way to the bottom of the grid, there's a ton of extra whitespace after the last row.

Any ideas when this may end up becoming part of a new release? For now I can deal with the 1px of whitespace, it's really not a huge deal (but I work with some people that I know are going to point it out, heh)

edit: It's really only noticeable for me because I'm doing alternating row colors, but the first one isn't white. I guess I can just swap which rows are gray/white and it won't be very noticeable at all.

edit2: This is only a problem with virtualization, so you can avoid it by disabling virtualization (for me, I bumped up virtualizationThreshold to 100 because I won't be displaying more than 100 rows at a time because I'm using server-side pagination anyways)

[viveleroi]

From a visual standpoint - .ui-grid-canvas { top: -1px } shifts the canvas to remove the white line without affecting the padding (and thus scroll), so that's one possible work-around.