#Group cannot expand TextInput but Flex can?

1 messages · Page 1 of 1 (latest)

deep beacon
#

I wanted to have TextInput and a button in the same row, so I used Group.
Button will take fixed width, and I wanted TextInput to fill the remaining width.
However, it was sending the button to the next row.
Using Flex however, instantly fixed it.
But why?

For more context

  1. there is no CSS file
  2. this option is inside aside from AppShell with width 300px. Increasing it to 350px or shrinking the button size will make group work but.. why does it matter? Shouldn't the text input automatically expand to fill?
CleanShot_2023-11-24_at_15.42.42.png CleanShot_2023-11-24_at_15.41.43.png CleanShot_2023-11-24_at_15.42.32.png CleanShot_2023-11-24_at_15.42.25.png
limpid hamlet
#

this is because Group and Flex have a different setting regarding the flex-wrap css property

#

Flex has nowrap as a default value, while Group has wrap as default value

#

This means Group prefers to let the element go to the next line if there is not enough room within the line