我想发生的是内部div占用其父div(outer)分配的空间的50%。取而代之的是,将获得视口可用空间的50%,这意味着随着浏览器/视口尺寸的缩小,它也会缩小。
鉴于外div有min-width的2000px,我希望内部的div至少1000px宽。
min-width
2000px
1000px
position:absolute/relative在节点上指定非静态位置意味着将其用作其中绝对位置元素的参考
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>