When utilizing Backgrid for editing values in a table, an <input type="text">
is inserted inside the <td>
. Despite setting the input to max-width: 100%
, it can still cause the column to expand beyond desired dimensions.
To see this behavior in action, take a look at the grid featured on their Examples section and select an item in the "Population" column. Even with the addition of the editor
class, padding is set to 0, and both the <td>
and <input>
elements have box-sizing: border-box
, the width of the column continues to grow.
So, does width: 100%
not actually mean 100% of the current <td>
width? Or is it simply impossible to achieve this effect using only CSS? It may be necessary to use a backbone event to determine the td size and then adjust the input accordingly, although that solution might seem a bit makeshift.