Well that, I’m trying to center a container vertically but I don’t know which formula to use. In the variable position of the container I used:
Theme variable (Card) - $cardPaddingVertical
Theme variable (Input) - $inputLabelMarginVertical and $inputPaddingVertical
Theme variable (Layout) - $PaddingPageVertical
But none of these works. Can you help me?
Hi, you can use systemVars
to determine the height of the viewport, and calculate the right position for the component based on that (docs). Also choose “Stretch to the viewport height” in the page advanced style properties.
Hi Mari, how can I determine the height of the graphics window and calculate the correct position? I’m sorry but my English is very bad and I have a hard time understanding the docs and videos!
Hi, actually no calculations are needed, here’s a step-by-step
Page stretched to viewport height:
Parent container set to viewport height:

Content justified to middle:
Now if I put a Card inside this container, it will be centered vertically:
Perfect!!! Now yes!! Thank you very much Mari!!!
Thank you so much mari.
I am not sure if the viewport.height
variable will be changed when the user changes the browser size on the desktop but feels like you could just set height: 100%
to the container to fill the page height.