Help on vertical aligning a div

I am new to Tailwind CSS and I haven't been able to center the main content vertically. I can only center it horizontally by justify-center. items-center is not taking effect. Any suggestion or link to related issue/docs is appreciated

Desired output: Div centered vertically only

Actual output: Div not centered

I have tried:

1. h-20 flex items-center to check if h-screen is the issue
2. h-screen grid content-center to check if flex is the issue
3. reading memes of how to center divs

Part of the code

Main is background color code and click me button