因此，我试图建立一个弹出框切换网站上的语言。
由于设计有一定的阴影，我需要从弹出块本身单独构建阴影。所以我想使用：：before伪元素将其放置在块下面。
现在我需要它从我使用它的元素继承高度，现在，在块中有三种语言选项，但是我不能使用静态高度，因为也许将来他们会想要添加更多的语言。
下面是我代码片段：

.l-pop {
  width: 150px;
  height: auto;
  position: absolute;
  bottom: -80px;
  background: #FFFFFF;
  box-shadow: 0px 4px 80px rgba(0, 0, 0, 0.07), 0px 1.67px 33.42px rgba(0, 0, 0, 0.0503), 0px 0.89px 17.87px rgba(0, 0, 0, 0.0417), 0px 0.5px 10.02px rgba(0, 0, 0, 0.035), 0px 0.27px 5.32px rgba(0, 0, 0, 0.0283), 0px 0.11px 2.21px rgba(0, 0, 0, 0.0197);
  border-radius: 6px;
  z-index: 3;
  padding: 8px 5px;
  display: flex;
  flex-direction: column;
}

.l-pop::before {
  content: '';
  width: inherit;
  height: inherit;
  /* height: 100% */
}

<div class="language__pop-up l-pop">
  <div class="l-pop__item">
    <img src="" alt="">
    <p></p>
  </div>
  <div class="l-pop__item">
    <img src="" alt="">
    <p></p>
  </div>
  <div class="l-pop__item">
    <img src="" alt="">
    <p></p>
  </div>
</div>

奇怪的是，它只对宽度有效，给：：before元素一个150 px的宽度，但对高度无效。
有没有一种方法可以让：：before伪元素从初始元素开始计算它的高度？
我试了试身高：继承和高度：100%，没有一个成功。
谢谢！