CSS:是否可以将高度为 100% 的 div 嵌套在高度为 auto 的 div 中？

Question

我正在尝试将一个 div 用作另一个 div 内的分隔线，但它没有显示出来。我想如果我将分隔符 div 的高度设置为 100%，它会自动调整到包含的 div 的高度，我已将高度设置为“自动”。

如果我将包含的 div 的高度更改为精确的像素数量，则分隔 div 开始运行并且工作正常。我希望它自动调整的原因是因为包含 div 的多个实例具有不同的内容，这将使高度从一个到另一个不同，所以仅仅为所有这些设置一个精确的像素数量是不够的。

这是我创建的 CSS

.container{
    width:600px;
    height:auto;
    margin:auto;
    float:left;
    display:block;
    }
 #divider{
    width:4px;
    height:100%;
    float:left;
    display:block;
    }

是我的编码错误还是有其他原因导致这不可能？预先感谢您的帮助。

Answer 1

100% 是相对于父级的。尝试将其设置为 100 vh。 Codepen

#divider{
  width:4px;
  height:100vh;
  float:left;
  display:block;
}