css - 强制 TextBox 占据 div 中的全部剩余大小

Question

我有一个 TextBox，旁边是一个带有 float:right 的 Button，它们都在一个具体宽度的 div 中。 Button 具有由宽度和高度定义的具体尺寸。我希望 TextBox 占据 Button 左侧的整个剩余宽度(因为 Button 位于右边缘)。特别是，上面的 div 属于 SplitPanel 的左侧。当我拖动 Split 时，我希望 TextBot 调整大小，而 Button 的大小应保持稳定。我对 Css 不是很熟悉，因此我需要一个指示来解决这个(微不足道的？)问题。

Answer 1

如果您真的不担心旧浏览器，您可以使用新的 width: calc() 方法:

input[type=text]
{
    width: -webkit-calc(100% - 58px); /*add more with the other vendor prefixes*/
}

http://jsfiddle.net/Kyle_Sevenoaks/4Lmeg/