PrimeNG - p-data The table height specified by the number of rows

Question

I am trying to find a solution to fix the height of the dataTable.

Pagination added to table. Changing the page to the second page, where the number of lines is less than on the initial page (in our case, the first page), the height of the data will be changed.

Answer 1

For me, this worked with the following css expression:

::ng-deep .ui-datatable-scrollable-view .ui-datatable-scrollable-body {
    min-height: 400px;
    border: 1px solid #D5D5D5;
}

:: ng-deep targets inside the primeNg <p-dataTable> element. Minimum height: 0px of class ui-datatable-scrollable-body will be overwritten by your desired minimum height.

Instead of a css selector, two css selectors are used.

, , .

https://plnkr.co/edit/8cFrCY?p=preview