Aria Button overflow when in slot and not within div

What are you trying to do?

I think something is off with the Aria Buttons to make them overflow when they’re in a slot. They’re fine when they’re in a slot and within a div; but outside of a div, they bleed over the boundary.

What are the reproduction steps?

Relevant links:

Hi, the issue is actually related to the Cols Gap property of Action Group element, you have set cols gap as 0.5 em (through a token), but as each element can have their own font size (em is defined base on the font size of the element, CSS values and units - CSS: Cascading Style Sheets | MDN), we arrive in a situation where the gap between the elements is not stable which makes the content displayed behave unexpectedly. I would recommend against using em as the unit for gaps.

1 Like