igniteui-angular icon indicating copy to clipboard operation
igniteui-angular copied to clipboard

When grid is inside a container with `display: contents` it does not span the full 100% of the height.

Open MayaKirova opened this issue 10 months ago • 1 comments

Description

When grid is inside a container with display: contents it does not span the full 100% of the height.

  • igniteui-angular version:
  • browser:

Steps to reproduce

  1. Open sample: https://stackblitz.com/edit/tchxxa

Result

There is white space below the grid.

Expected result

It should expand to 100% height.

MayaKirova avatar Apr 22 '24 08:04 MayaKirova

Small correction on the actual result: It's not that the Grid doesn't span to 100% - it does. Actually, since the display: grid handles the internal structure the actual grid tbody is also correctly stretched to fill in the space. It's the tbody content container that's restricted by the calculated height.

So there's white space inside the grid tbody, where there shouldn't be :)

In a sense that's a bit related to the work being done for #14015 (new resize observer of the tbody at the very least should allows us to just measure directly in most cases) or at least part of the calculations we're should attempt to simplify or remove after. Looking at the fix, seems like it's more of a check for the calculation, but still. Edit: Task in question to simplify body calculations: #14048

damyanpetev avatar Apr 26 '24 14:04 damyanpetev