如何使div相对于父div而不是视口的百分比宽度

• Z时代
• 2024-01-10
• 分类：问答

我想发生的是内部div占用其父div（outer）分配的空间的50％。取而代之的是，将获得视口可用空间的50％，这意味着随着浏览器/视口尺寸的缩小，它也会缩小。

鉴于外div有min-width的2000px，我希望内部的div至少1000px宽。

回答：

position:absolute/relative在节点上指定非静态位置意味着将其用作其中绝对位置元素的参考

我们可以更改定位上下文-绝对定位的元素相对于哪个元素定位。这是通过在元素的祖先之一上设置位置来完成的。

#outer {
  min-width: 2000px;
  min-height: 1000px;
  background: #3e3e3e;
  position:relative
}
#inner {
  left: 1%;
  top: 45px;
  width: 50%;
  height: auto;
  position: absolute;
  z-index: 1;
}
#inner-inner {
  background: #efffef;
  position: absolute;
  height: 400px;
  right: 0px;
  left: 0px;
}
<div id="outer">
  <div id="inner">
    <div id="inner-inner"></div>
  </div>
</div>

以上是 如何使div相对于父div而不是视口的百分比宽度 的全部内容， 来源链接： utcz.com/qa/418237.html