Weird behavior of flex-direction: row

Hello everyone,
I recently encountered a really weird behavior of elements combination:

<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" editor-extension-mode="False">
    <Style src="project://database/Assets/test.uss?type=3#test" />
    <ui:VisualElement name="container" class="container">
        <ui:VisualElement name="control" class="control">
            <ui:Label tabindex="-1" text="Test" parse-escape-sequences="true" display-tooltip-when-elided="true" />
        </ui:VisualElement>
    </ui:VisualElement>
</ui:UXML>

#container {
    align-items: center;
}

#control {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding-right: 24px;
    padding-left: 24px;
    background-color: rgb(255, 255, 255);
    min-width: 140px;
}

I would assume that the text is aligned in the center of the element, however, for some reason, it’s offset to the right.
image

Removing min-width or paddings results in a correct behavior, so this appears to be a bug.
Or am I missing something?
Thanks.

Anyone? Is this a bug, or am I missing something?

I’m using Unity 6000.0.17f1 and I don’t have the problem. It might be a bug depending on your version?

Yes, you are right. Unity 6 works fine. The problem is on the latest LTS version.

Hi,
Please file a bug report

Bug report is up.

1 Like