Html 在内部时，最大高度不适用于百分比'；位置：固定'；

我有一个弹出对话框，里面有一个项目列表。我试图给项目列表一个相对于屏幕整体高度的最大高度

在对样式进行了一些修改之后，在我看来，当弹出对话框具有最大高度时，它似乎不起作用，因为它在计算中创建了一个循环：弹出对话框的高度取决于项目列表上的高度，而项目列表的最大高度取决于弹出对话框的高度

请参阅随附的plunkr以获取示例：当弹出式容器的最大高度为66%时，项目列表（弹出式内容）没有最大高度

---

这似乎起到了作用： 整个CSS页面：

/* Styles go here */

* {
  box-sizing: border-box;
}

html, body {
  height: 100%;
  padding: 0;
  margin: 0;
}

#popup-container {
  position:fixed;
  max-height: 66%; 
  border: 1px solid black;
  width: 500px;
  bottom: 0;
  right: 0;
  overflow: auto;
}

.popup-footer , .popup-header {
  display: block;
  background: #ccc;
  height: 20px;
  position: fixed;
  width: 480px;
}
.popup-footer{
  position: fixed;
  bottom: 0;
}

虽然页脚有点粗糙。。。我还不知道如何解决这个问题。

---

我给了页眉/页脚一个宽度，这样它就不会越过滚动条：S

我在plunkr链接上看不到任何东西。但是无论如何，是的，如果某个东西没有高度（即使它有最小高度或最大高度），它的子对象也不能有百分比形式的相对高度；到你的容器，因为那是最大高度。这并不能解决您的整个问题，我只是注意到，无论如何，页脚可以“固定在底部0”，因为我想容器已经处于“固定和底部0”。