Question Issue with negative margins to center a window

Here's a Yogalayout example of what I wanna do: https://bit.ly/3xjK2Hh.
Basically I want to center a window by having it be position: absolute, left and top to 50%, and then negative magins equal to half the height and width. Classic way to center an element in HTML.

It seems to work fine in the yogalayout, but it looks like this in Unity:



The content goes out of the window.

Any idea how to fix that? Thanks.

 

You could try using transform > translate x and y by -50% rather than negative margins - something like:

Code (CSharp):

1. display: flex;
2. left: 50%;
3. top: 50%;
4. position: absolute;
5. translate: -50% -50%;
6. width: 150px;
7. height: 150px;

 

Ah, that's a good idea, I'll give that a shot. Another option would also be to just compute the exact "left" and "top" based on the screen size. That might make more sense potentially since those windows are draggable and the left and top will be changed to px values.