-
WebGeek
Hi there,
I have a section (see screenshot link in Private info), which is built using a two column flex layout. Text on the left side, a button on the right.The text field (and possibly button text) is populating dynamically from ACF so I want to create a structure that changes the width of the two containers but maintains the button on one line.
I can achieve this by entering a % width for the button container but it’s not ideal because if the button text changes I might need more width than that.
How can I achieve so the width of each container changes dynamically according to the content but ensures the width of the button is enough so it doesn’t break to multiple lines?
Thanks!
-
Alvind
Hi there,
You can try setting both containers’ Width value to
fit-content.Let me know if it works!
-
WebGeek
No, didn’t work completely though it did reduce the button test from 3 lines to 2 lines.
-
Alvind
If you know the maximum width of the dynamic text that will appear on the button, you can set the button’s width to match that maximum value. This ensures it won’t exceed the expected width, while shorter text will naturally adjust to fit.
-
WebGeek
Ok, thanks. I don’t know it really. Leave this one with me, I’ll see if I can work something out.
-
Alvind
Sure, no problem 🙂
- You must be logged in to reply to this topic.