问题描述
假设我有两个div，一个在另一个里面，就像这样： < html>
< body>
< div id =outerstyle =width：50％>
< div id =innerstyle =width：100％>
< / div>
< / div>
< / body>
< / html>
现在，内部div的宽度为屏幕尺寸的50％的100％ 50％的屏幕尺寸。如果我将内部div改为绝对位置，如下所示：
< html>
< body>
< div id =outerstyle =width：50％>
< div id =innerstyle =position：absolute; width：100％>
< / div>
< / div>
< / body>
< / html>
在这种情况下，内部div占用了屏幕空间的100％，因为它的位置设置为绝对。
我的问题是这样的：有没有办法保持内部div的相对宽度，而其位置设置为绝对？
将位置：相对添加到您的外部div。 > update ：它的工作原理是因为 position：absolute 中的位置相对于具有某种定位的第一个父对象（静态除外）。在这种情况下，没有这样的容器，所以它使用该页面。
Let's say I have two divs, one inside the other, like so:
<html>
<body>
<div id="outer" style="width:50%">
<div id="inner" style="width:100%">
</div>
</div>
</body>
</html>
Right now, the inner div has a width of 100% of 50% of the screen size, or 50% of the screen size. If I were to change the inner div to position absolute, like this:
<html>
<body>
<div id="outer" style="width:50%">
<div id="inner" style="position:absolute;width:100%">
</div>
</div>
</body>
</html>
In this case the inner div takes up 100% of the screen space, because its position is set to absolute.
My question is this: Is there any way to maintain relative width of the inner div while its position is set to absolute?
Add position:relative to your outer div.
update: It works because positions in position: absolute are relative to the first parent that has some positioning (other than static). In this case there was no such container, so it uses the page.
这篇关于有没有什么办法可以让“position：absolute” div保留相对宽度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！