Question

I’m working on an interface and this thing is bugging me.

Please see: http://jsfiddle.net/NUKxX/

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.

I tried fiddling around with position:absolute on the input and position:relative on the th but Firefox ignores the latter mentioned as well.

How do I make it work?

Answer 1

th input {
    min-width: 10px;
    max-width: 100%;
    width: 100%;
}

Correct the problem here (FF 17.0.1).

Fiddle: http://jsfiddle.net/Regisc/PcKMJ/