Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1307

How to vertically center the content section of a Tailwind PrimeVue Panel?

$
0
0

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?


Viewing all articles
Browse latest Browse all 1307

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>