css - 让 Firefox 正确拉伸(stretch)输入

Question

这是我正在尝试做的事情的简化版本。适用于 FF 以外的所有浏览器:

http://jsfiddle.net/hDFnW/10/

基本上，我正在尝试获取应用 width:auto; 的输入什么时候position:absolute;left:200px;right:0px已设置。

它适用于除输入之外的任何...我现在很困惑。

我如何在 Firefox 中或更好地跨所有浏览器完成此操作？

Answer 1

你可以用 div 包装 input 然后它就可以工作了。

CSS

div {
    display    : block;
    position   : absolute;
    left       : 100px;
    right      : 0px;
    top        : 3px;
}

input {
    width      : 100%;  
    border     : 1px solid #000;
    background : #FFF;
}

jsFiddle使用其他示例。

jsFiddle一切正常。

例子

你可以获得类似的效果(尽管不一样)using floats .