gpt4 book ai didi

html - 为什么我的位置是:absolute not obeying my position:relative div?

转载 作者:行者123 更新时间:2023-11-28 04:57:04 25 4
gpt4 key购买 nike

谁能给我解释一下为什么我的 position:absolute div 不服从我的 position:relative div?

我敢肯定它确实很简单,但我终究无法理解它是什么。

我希望看到 position:absolute div (class-2) 位于 position:relative div (class-1) 的内部。

这是两个类',下面代码的完整链接:

div.class-1 {
position:relative;
background-color:#CCC;
width: 500px;
height: 200px;
}

div.class-2 {
position:absolute;
background-color:#C96;
width: 250px;
height: 100px;
top:0px;
right:0px;
}

HTML

<div class="wrapper">
<div class="before">class-before</div>
<div class="class-1">class-1</div>
<div class="class-2">class-2</div>
<div class="after">class-after</div>
</div>

http://jsfiddle.net/craig_wadman/HMwtN/

希望一切都有意义?

最佳答案

绝对定位元素必须嵌套在相对定位元素内以获得所需结果:

<div class="class-1">
<div class="class-2">class-2</div>
</div>

绝对定位101:绝对定位元素相对于最近的定位(相对、绝对或固定)父元素定位;如果没有那么<body>使用(您的原始标记就是这种情况)。

Demo here

关于html - 为什么我的位置是:absolute not obeying my position:relative div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20969939/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com