Question

我有ul这是页面的高度。我希望它能够在那个ul里面滚动。这可以在这里看到：http://d.saew.it/pRyz

如您所见，它可以滚动为页面的高度。现在，我也希望它有一个标题，你可以在那里看到。它应该在顶部“固定”，但ul列表的宽度是可变的，因此我无法将其设置为固定，因为它不能在可变宽度的父级中居中。

现在，我的工作几乎完美，除了height: 100%的{{1}}是父亲的高度（与窗口相同），而{{1}标题仍然占用它上面的空间。因此，这会将ul几个像素从父元素的末尾抛出。看看：http://d.saew.it/NXL1

有没有办法完成我在纯CSS中尝试的内容？

编辑：

代码在手写笔中，但任何人都应该能够阅读它：

div

这些元素的所有父母都有ul，以允许它达到窗口的高度。

Answer 1

我并不完全清楚你想要什么，但this是我最好的猜测。

基本上你正在做的是使用绝对定位和溢出规则来控制滚动和滚动的位置。

容器包含标题和可滚动列表，并在页面正文中包含height: 100%。它还有position: relative，因此可以绝对定位其子元素。

子元素 - 标题和列表 - 都有position: absolute。这样你就可以强制列表的高度既受限制（因此其内容溢出）又变量（根据其父级的高度），即它应该始终正是其父级的高度，减去高度标题。请注意，其top属性的值需要与标题的总高度相对应 - 包括填充和边框。

然后，要获得滚动列表，您只需在列表中使用overflow: auto。

要在标题中获取居中文字就像text-align: center一样简单，无论容器的宽度如何都可以。