css - 如何使输入元素显示与块元素相同？

Question

我想在他附近用固体制作通用流体元素并将它们排成一行：

// wrapper starts here
[=(XX%)=solid=] [---------------------(auto)-fluid-]
[=(XX%)=solid====================] [--(auto)-fluid-]
[-(auto)-fluid---------------------] [=(XX%)=solid=]
[-(auto)-fluid--] [=(XX%)=solid====================]
// wrapper ends here

但是当我尝试使用“float：”样式属性的传统变体时 - 在“input”元素上失败：http: //jsfiddle.net/iegik/pMRD8/

还尝试了类似问题中提供的 hack：是什么让我的输入元素无法像块元素一样显示？

Answer 1

可以使用一点 javascript 和数学：

var b = $("#mainWrap").css('padding').split('p')[0];
$("#fluidInput").width($("#mainWrap").width() - $("#btn1").width() - (b * 2));

http://jsfiddle.net/TNCodeMonkey/pMRD8/4/