Width is 0 after setting DisplayStyle to Flex.

I have a “ghost” element that I’m using to simulate dragging an item. On the mouse down event, I want to center the element at the mouse position. Therefore, I do the following:

m_GhostElement.style.display = DisplayStyle.Flex;
m_GhostElement.style.left = evt.mousePosition.x - m_GhostElement.layout.width / 2;

However, the width is 0 at that point of the code. Is there something I’m missing? Do I have to wait until the end of the frame for the display style change to take effect?

The reason I say that, is the logic works in the subsequent mouse move event callback.

Yes, this change doesn’t happen immediately.

You could use the visibility=hidden/visible style instead which doesn’t change the size of the element.

Gotcha. Is there a way of setting the visibility to hidden and ignoring events?