Bug - Label - children inside are not align property with pf5

[aljesusg]

Describe the problem
Items are not aligned horizontally

How do you reproduce the problem?

Grid items with align , it seems that style pf-v5-c-label__content > pf-v5-c-label__text is not working

Is this issue blocking you?

Fix adding class pf-v5-c-label__content to the second span

Screenshots

Before

## Now

What is your environment?
"@patternfly/patternfly": "5.0.0",
"@patternfly/react-charts": "7.0.0",
"@patternfly/react-core": "5.0.0",
"@patternfly/react-table": "5.0.0",
"@patternfly/react-tokens": "5.0.0",
"@patternfly/react-topology": "5.0.0",

What is your product and what release date are you targeting?

Any other information?

[mcoker]

Hey @aljesusg taking a stab at it from the markup I see generated in dev tools... it looks like the problem may be that the additional icons are wrapped in <div> elements, which are block elements, so they're putting their contents on a new line. I wonder if either removing the divs and including the icons directly, or changing the divs to inline <span> elements would address that? Here is a codesandbox demonstrating those 2 fixes - https://codesandbox.io/s/tender-sutherland-ncqmhr?file=/index.html

If that resolves it, it's because previously all of your content was a child of pf-v5-c-label__content, which was a flex layout, and by default a flex layout will put all of its children side-by-side in a row, whether the elements were inline or block. Now all of your content is a child of pf-v5-c-label__text, which is just a regular block element, so any children of that element will lay out normally (block elements will be put on a new line, for example).

If that doesn't resolve it, can you share a codesandbox that replicates your markup and reproduces the problem you're seeing?

[aljesusg]

Yep it was fixed after add them inside the icon element thanks !