如何设置输入宽度以填充div的其余部分并动态调整

Question

如何根据屏幕大小/调整大小来获取一个与标签内联的输入以填充包装div容器宽度的其余部分？

我的HTML如下：

<div class="form-field sixcol">
    <label class="form-label>...</label>
    <input type="text">...</input>
</div>

我的JavaScript如下：

function formFields()
{
    var formField = $('div.form-field').outerWidth();
    var formLabel = $('label.form-label').outerWidth();
    var formInput = formField - formLabel;

    $('input.form-input').css('width', formInput);
}
...
$(document).ready(function(){
    formFields();
    ...
});

$(document).resize(function(){
    formFields();
    ...
});

当我使用formFields()函数将每个元素的大小打印到<p>标记时，它报告了表单字段元素的错误宽度，因此计算了表单的错误大小 - 输入。我的标签和输入都有1px边框。我应该使用innerHeight（）吗？为什么不能正确计算？