Search Issue Tracker

By Design



Found in






Issue ID




UI Toolkit Width and Height behave inconsistently with margins when they are measured in percentage



Reproduction steps:
1. Open the attached project
2. Open “NewUXMLTemplate.uxml” file located in the Assets folder
3. Select “VisualElement” and change its Size to 100% Width and Height

Expected result: Width and Height behaves identically
Actual result: The element with its margin is fitted completely into a parent object for Height, but goes over for Width

Reproducible with: 2020.3.40f1, 2021.3.10f1, 2022.1.17f1, 2022.2.0b8, 2023.1.0a11

Reproducible on: macOS 12.6 (Intel)

  1. Resolution Note:

    The component default size is 100% but by default the flex shrink is 1 and reduce the size of the element so that it fit, along with its margins, in the flex direction.

    You can set the flex shrink value to 0 along with width and height of 100% to have a fully symmetrical behavior where the element has exactly the same size of the parent.

    Or you can set the flex grow on the element to 1 without setting any width and height.

Add comment

Log in to post comment

All about bugs

View bugs we have successfully reproduced, and vote for the bugs you want to see fixed most urgently.