css - 为什么输入类型=文本的正确设置不再起作用？

Question

2 周前我写了这部分 html 和 css 代码，看起来像这样，它工作正常，应该是这样的:

<div class="divclass1">
    <input type="text" class="inputclass1" />
</div>

.divclass1 {
    position: absolute;
    left: 0px;
    right: 0px;
    height: 26px;
    background-color: blue;
}

.inputclass1 {
    position: absolute;
    left: 0px; 
    right: 0px;
}

div 已填满(已选中 chrome)，输入字段也已填满，就像我想要的那样。现在，这周我再次测试我未更改的 html 代码(或者实际上，我正在测试一些后端代码，但这与这个问题无关)突然，输入字段不再填充到他的父 div 但是处于默认宽度。就像 right: 0px 和 left: 0px 不能一起工作一样，因为当我取消选中 left: 0px;在 chrome 中，输入字段右对齐(但仍未填充)。此外，不仅是 chrome 会出现此问题，IE、FF、Opera 也是如此。只有 Safari 以应有的方式显示输入框。

我添加了一个 jsfiddle 链接来演示这个问题:fiddle link: http://jsfiddle.net/8ekbb/2/

我找到了解决方案(也包含在 fiddle 中)，但我真的想知道这个问题是否是一个错误，如果是，是否会再次修复？或者它现在是否按应有的方式工作，旧的它是现在修复的错误吗？

Answer 1

您需要在 css 中使用 only 或 right 或 left 并添加 top 或 bottom 位置，如果您元素有这样的 position:absolute:

.divclass1 {
    position: absolute;
    top:0;
    right: 0;
    height: 26px;
    background-color: blue;
    width:100%;
}

.inputclass1 {
    position: absolute;
    top:0;
    right: 0px;
    width:100%;
}

DEMO