Hello Code, is it possible to use WIX Code to center an object vertically on the screen?
I am using a workaround now by using a Lightbox, as it is the only wix element that centers horizontally and vertically in the middle of the screen. But It loads slowly so I was wondering if this was possible with Code instead.
What I want is to be able to center a Menu object, in the middle of the screen horizontally and vertically. See here > www.hza.no
Please help med 
There’s no Wixcode API to control components’ position.
I think that you can manually center the element in the editor and pin to screen so it stays in this position.
Yes, but it will be offset from the pinned side with amount of pixels, and not precentage of the screeen. Which makes it not very useful for different screen sizes. As is, Lightbox is the only element that is by default centered vertically on the screen, so Im using that workaround, but as I say, it is a bit slow popping up on the screen.
Hi Johann.
I am struggling with the same problem. Did you find a solution to this?
The problem with lightboxes is, that it does not allow you to use any elements underneath … Or is there another workaround for that?
Hello Jonas. No solution other than lightbox. I have elements underneath the page I am using the lightbox. Check out the landing page of the site I use it on: www.hza.no
I have background element behind, logo in the upper left corner and social icons on the bottom. The lightbox only contains the center letters NEWS WORK STUDIO and that lightbox is not filling the whole screen, its around 500x500px.
Thank you for your answer!
That looks neat. Not only the website, but also your projects.
My lightbox is 150x600 px - but, however the “overlay” (no image, no colour, fully transparent) around it blocks all elements underneath. How do it avoid this? Am I missing something?
@jonaskirsch I was wrong there. I actually have all “interactive” objects (links, buttons etc) embedded in the lightbox. In my case it is only the social icons, they are outside the lightbox 500x500 px area but pinned to the lower bottom of the screen. Lightbox only loads automatically once for every page visit, so if a guest ends up on my landing page in the same session, the lightbox will not appear automatically (so stupid), to “solve” that I have an invisible button that covers the whole page that triggers the lightbox.
A simple “align center horizontal/vertically” for a box container would solve all this clutter.
@jmk005 Thanks for clarifying.
Indeed, it is a mystery to me why it is not offered to “pin to center” or why you can not grab the screensize and have a scaling & positioning in proportion. With devices ranging from small notebooks to 6k screens, that would make things easier.
Especially as lightbox seems to do exactly this.
Therefore with other limitations …
But well …
Hi! This is a real problem. At the moment there is no possibility to make a strict vertical alignment. I can offer an alternative solution. Sure, this will not solve all your problems. But it’s better than nothing 
The responsive text will change its size when you change the width of the screen and will move the strip (box) with your content down or up. Sure, this layout depends on the width of the screen, and you may have problems on devices with a vertical screen. This option will not allow for a strict vertical alignment. But I think that it is possible to choose the parameters of the responsive text in such a way that the problem is minimal.
You can read more about the responsive text in this post
My example (experiment) https://www.wixcraftplay.com/beats
@eugene-m , if you go for this direction, you can make it also without responsive text:.
You don’t need to change the text size, only the html line-height (use $w(“#text1”).html = …).
and use wixWindow.getBoundingRect() to get the screen size and then set the line-height to be half of the screen size (Y-axis).
@jonatandor35 Thanks, need to try. It may work. But I am afraid that there is a line-height limit. In the editor, you can use a line-height of no more than 3.
@eugene-m I tried it a long ago and it worked. If you use the html property there’s no limit.
