textboxes in HTML table: How to auto-size?

Question

I want to add a row at the bottom of my HTML table (or at the top, whatever) with a textbox in each column (to allow filtering of content of each column).

FWIW, the table is based on the jQuery DataTables plug-in.

The problem is that the textboxes widen the columns. I want each textbox to fill the width of its column without enlarging it. How can I do this?

Answer 1

try <input type="text" style="width:100%"/> to get the width of parent td.