title: I need to make an input element adjust to table cell width
body: <p>I'm working on an interface and this thing is bugging me.</p>
  
  <p>Please see: <a href="http://jsfiddle.net/NUKxX/" rel="noreferrer">http://jsfiddle.net/NUKxX/</a></p>
  
  <p>It works in Chrome but not in Firefox. The basic idea in Chrome is that the longest word in each columns stretches the td or th to appropriate length in order to preserve space. But in Firefox input elements seem to completely ignore max-width and min-width. </p>
  
  <p>I tried fiddling around with <code>position:absolute</code> on the input and <code>position:relative</code> on the th but Firefox ignores the latter mentioned as well.</p>
  
  <p>How do I make it work?</p>