[FIXED] Primeflex + PrimeNG tab + PrimeNG tree – unable to make tabPanel grow


Could someone help me with the layout of those PrimeNG components?

I would like to have a tree taking the whole vertical space (minus buttonset at the bottom), scrolling if needed. Tree is being places inside a tab panel.

Thanks in advance



Either you can add this kind of CSS

.p-tree {
  height: calc(100vh - 300px);
  overflow: auto;

but in order to apply it, you have to declare encapsulation: ViewEncapsulation.None in your component definition. See StackBlitz.

Either you just add in your CSS:

:host ::ng-deep .p-tree {
  height: calc(100vh - 300px);
  overflow: auto;

Answered By – Antikhippe

Answer Checked By – Candace Johnson (Easybugfix Volunteer)

Leave a Reply

(*) Required, Your email will not be published