Hello Mike,

I have been looking into your question and the described behavior is due to the reason that there is no set height defined for the igx-grid component itself or for its parent element (the element in which the grid is located). For this reason, the border of the grid cannot be set and its height continues to grow.

What I could suggest as an approach is to set a certain height of the grid itself by handling the height property of the grid.

<igx-grid
    #grid
    [data]="data"
    [autoGenerate]="false"
    width="100%"
    height="600px"
  ></igx-grid>

The other approach you can use is if the grid has no set height but has a parent element to set a given height to that element. The result of this will be the ability to see a grid border without its height continuing to grow.

<div class="grid__wrapper">
  <igx-grid></igx-grid>
</div>

.grid__wrapper {
    height: 600px;
}

The described scenario could be observed here:

In addition, I have prepared small sample illustrating this behavior which could be found here. Please test it on your side and let me know how it behaves.

If you require any further assistance on the matter, please let me know.

Regards,

Georgi Anastasov

Entry Level Software Developer

Infragistics