CSS：为什么输入宽度：100％不在绝对框中展开？ [英] CSS: Why an input width:100% doesn't expand in an absolute box?
本文介绍了CSS：为什么输入宽度：100％不在绝对框中展开？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有两个输入：它们都有一个宽度：100％，第二个是一个绝对方框：
I have 2 inputs: they both have a width: 100%, and the second one is an absolute box:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">
#box1 { position: absolute }
#box1 { background: #666 }
input { width: 100% }
</style>
</head>
<body>
<form>
<input type="text">
<div id="box1">
<input type="text">
</div>
</form>
</body>
</html>
- 在符合标准的浏览器上，
：100％似乎对绝对定位框内的输入没有影响，但它在不在绝对绝对框内的输入上。 - 在IE7上，两个输入都占用了页面的整个宽度。
- On standard-compliant browsers, the
width: 100%seems to have no effect on the input inside the absolutely positioned box, but it does on the input which is not inside that absolutely absolute box. - On IE7, both inputs take the whole width of the page.
- 为什么
width：100％对符合标准的浏览器没有效果？我不得不说，IE7呈现这种感觉对我更直观。 - 如何让IE7渲染像其他浏览器，如果我不能删除<$ c
- Why does the
width: 100%have no effect with standard-compliant browsers? I have to say that the way IE7 renders this feels more intuitive to me. - How can I get IE7 to render things like the other browsers, if I can't remove the
width: 100%and can't set a width on the absolutely positioned box?
两个问题要记住：
推荐答案
CSS 2.1规范说，在这种情况下发生的情况没有指定。事实上，不同的浏览器实现了不同的。您可以在以下网址找到更多详细信息（包括更多案例和屏幕截图）：宽度属性在绝对定位框。
The CSS 2.1 specification says that what happens in this case is not specified. And indeed, different browsers implemented this differently. You'll find more details on this (including more cases and screenshots) on: Width property inside an absolutely positioned box.
这篇关于CSS：为什么输入宽度：100％不在绝对框中展开？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
