Force a container to only expand as much as its children require.

Unity Engine
,
1

This is my problem:

Ignore the fake-parent, it’s only there to set the root align-items to flex-start.

The container has a header and a body.

The header has an icon and a title.
The body has some description.

Icon is fixed-size (20x20) and I want the title to determine the width of the whole container.

If the description goes wider than that, it should wrap.

Can anyone please tell me how I can achieve this.

7397039--903482--help.png
7397039--903482--help.png782×466 36.9 KB

2

All the objects are either VisualElement or Labels. None of them have any inline styling.

This is the current USS file.

#fake-parent {
    align-items: flex-start;
}

#subnode-header {
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
}

#subnode-icon {
    background-image: resource('Icons/testicon');
    min-width: 20px;
    min-height: 20px;
    -unity-background-scale-mode: scale-to-fit;
    margin: 5px;
}

#subnode-title {
    font-size: 20px;
    -unity-font-style: bold;
    margin: 5px;
}

#subnode-description {
    white-space: normal;
    margin: 5px;
}