How do I make the calendar take 100% height of the window

  • 1
  • Question
  • Updated 2 years ago
  • Answered
  • (Edited)
As we can see the calendar doesn't take the full height of the window.
I could not find a way to adjust it.
Any good approach to do so?

I tried to make this DOM element 100% height,
It's still not taking the full height.

I tried to apply

        height: 100vw;

To make the calendar take the full height of window and also not overflow the window which means the y-scroll bar won't appear.
However, it didn't work at all.

any idea?

Photo of Poc


  • 496 Points 250 badge 2x thumb

Posted 2 years ago

  • 1
Photo of Christine Jessen

Christine Jessen

  • 690 Points 500 badge 2x thumb
Hi -

Thanks for your question!  I think you're pretty close, instead of the vw (which is the viewport width), try vh (viewport height).
.nx-cal-table {
    height: 90vh;
You can play around with the number to find what works best for you without the scrollbar showing. 90vh worked well for me when I tested it out.

Hope it works for you!