Input Fit to Width

Need help Responsiveness
1

Is there a way for an input to fit to width based on the content of the input? So if a user is typing, the width of the input expands with additional text, and contracts as they delete text. I don’t think this is possible natively, but perhaps there is a CSS or HTML solution. I have three inputs in a single row, so the idea is that the width of the three inputs would be able to respond dynamically to each other.

2

You need to use multiline input for that.

if you really need to keep input

1 Like
3

I’m not familiar with a setting to make the multiline input fit to width. Is there something I’m missing?

Thanks for the link - I’m experimenting with that now!

2 Likes
4

Hi @ladd0393 have you been able to figure out how to do auto-adjust width for input field? I’m looking for a solution as well…

5

just started to try it and i think it works or might work with some work
use this plugin Dynamic Width and Height Plugin | Bubble
for width value you can use …'s number of chracters*9 .(for each character at input you are adding 9pixel width)

  • if you are not taking data from database or its going to be edited you need an input wathcher to see how many characters are they at the input for this kind of problem you can use this plugin 1T - Input Watcher Plugin | Bubble
    i dont know but maybe input watcher also works with inputs with content from database in them i dont know didnt tried.
    also you might need to add some conditions to dynamic width and height element. like if its bigger than 300px dont show input show multiline input instead and this time dynamic height is (number of characters    9)/250)*15 (math may not be correct but you got the idea i think.
    *also if you are using dynamic width element in a repeating group each elements id must be unique so you might want to add current cell’s index to element id’s.
    good luck.