html - 如何用相对位置div完全包裹绝对位置div？

在不定义外部相对位置div的高度和宽度像素值的情况下，是否可以用相对位置div完全包装绝对位置div？在这里，我看不到"outerrelativediv"的红色边框。

<div id="outerrelativediv" style="position:relative;display:inline-block;border:1px solid red;">
  <div id="innerabsolutediv" style="position:absolute;display:inline-block;">
    SOMETEXT HERE!!!
  </div>
</div>

https://jsfiddle.net/L3bytwnj/

最佳答案

简单的答案是：不。
当你给一个元素position: absolute;时，你会把它从正常的内容流中去掉。如果它是其父级的唯一子级，则父级将没有流内容。它将是空的。
通常，空的html元素的width和height值都是0的，反过来，在正常的内容流中不会占用空间。有一些异常可能会导致呈现空元素，例如作为扩展其子元素的父元素的子元素。但是在父元素链的某个点上，其中一个必须有一个集合维度或至少一些生成某些flex/height的内容（可能在同级链中），否则它们都将只是一个未呈现的空元素的大链。
此外，子元素上的width和padding属性在父元素上生成border/width，即使子元素没有内容。