CSS将相对定位div移动到溢出隐藏div之外

亚辛约鲁克

我必须移动一个 div 来溢出隐藏的父 div。我在页面上使用了一些插件。所以我不能改变 div 的顺序。我想将绿色框移到蓝色和红色框上。我希望有一个解决方案。

https://jsfiddle.net/bigboytr/zssub946/

重要说明:如果我更改父 divs 位置属性,插件将无法正常工作。

#box1 {
  position: absolute;
  background: red;
  padding: 5px;
  width: 150px;
  height: 150px;
}

#box2 {
  position: absolute;
  overflow: hidden;
  background: blue;
  width: 100px;
  height: 100px;
}

#box3 {
  position: relative;
  background: green;
  width: 50px;
  height: 50px;
  top: -10px;
}
<div id="box1">
  <div id="box2">
    <div id="box3"></div>
  </div>
</div>

亚辛约鲁克
  1. 将 box2 溢出属性移动到 box1。
  2. 为 box1 提供填充。
  3. 将负值赋给 box3 以弹出。

#box1 {
  position: absolute;
  background: red;
  width: 100px;
  height: 100px;
  padding: 5px;
  overflow: hidden;
}

#box2 {
  position: absolute;
  background: blue;
  width: 100px;
  height: 100px;
}

#box3 {
  position: absolute;
  background: green;
  width: 50px;
  height: 50px;
  top: -5px;
  right: 0;
}
<div id="box1">
  <div id="box2">
    <div id="box3"></div>
  </div>
</div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章