I am using the Tailwind PrimeVue Panel element with Aura presets.
I want the content area to be vertically centered. I do not want the header to change, only the content area.
I have tried putting flex flex-col justify-center
on the inner div but it doesn't vertically center.
<Panel header="Keep This Heading"><div class="flex flex-col justify-center">Make this vertically centered</div></Panel>
I have also tried adding it to the content class as a pass through but it also doesn't vertically center.
<Panel header="Keep This Heading" pt:content:class="flex flex-col justify-center"><div>Make this vertically centered</div></Panel>
Since the problem may be related to other parent elements you can also see a minimal reproduction here: https://stackblitz.com/edit/nuxt-starter-ydsfsn?file=pages%2Findex.vue
How can I make this work?