twitter bootstrap块级别表单

Question

我正在尝试获取全宽度登录表单。基本上，用户名，密码和按钮的输入字段都应该具有相同的长度。现在我可以轻松地使用跨度来解决这个问题，问题是当我在用户名和密码上有“前置”图标时，输入字段超出了跨度（如果我将输入块级别应用于输入）并且按钮跨度只有外跨度很短（如果我尝试btn-block）。如何让所有元素仅延伸到包含的跨度宽度？

这是我的小提琴。

http://jsfiddle.net/sujesharukil/EP83X/21/

Answer 1

您可以使用display：table和display：table-cell来获取输入以正确填充跨距中的剩余空间或使用流体宽度。这是第一种方法的小提琴：

http://jsfiddle.net/EP83X/22/

或者根据固定图标宽度（28px）和跨度宽度（（300-28）/ 300 * 100）在输入上使用宽度：90.666％。