0

I have a tr with td's containing inputs. I'm not applying any size attribute or style with regard to width.

Some inputs contain just single digits and some contain words. The ones containing single digits have much extra white space and the ones containing words contain far less.

When I resize the page containing the table, the table shrinks to keep fitting 100% of the page. But, all the inputs seem to basically resize at about the same rate with no regard for which input has the most space to give up. By space, I mean the empty area in the input that does not show any data; the extra space to the right (as my inputs are left aligned).

<code>input</code>s are not reduced intelligently

Is there a css property that would apply to this situation to help accomplish reducing the size of the inputs which have the most white space to give up first and putting off truncating visible text as long as possible?

toddmo
  • 20,682
  • 14
  • 97
  • 107

1 Answers1

0

You could try auto sizing the inputs using a script like this:

https://stackoverflow.com/a/931695/288568

Anyways, the script is not for drop downs so far, but could be adapted.

But: If in the first line there is a 1 and in the second a 11 then the inputs would have different sizes.

Community
  • 1
  • 1
Alex
  • 32,506
  • 16
  • 106
  • 171
  • http://samtag.googlecode.com/svn-history/r2/trunk/js/jquery.autoGrowInput.js is no longer a valid url :) – toddmo May 21 '16 at 22:21
  • I did not mention that URL? – Alex May 22 '16 at 10:15
  • I looked at it again, and unless I'm misunderstanding, this script is to resize a single textbox for key events according to the content of the textbox, not resize sets of textboxes a certain way when their container (in my case the `TABLE`) resizes. Technically, I would be resizing `TD` elements based on all `INPUT`s in that column, then just resizing the `INPUT` elements to fill the calculated size. Does that make sense? – toddmo Jun 14 '16 at 16:23