引导棒导航到底部，但在容器末端停止

【问题标题】：bootstrap stick nav to bottom but stop at end of container引导棒导航到底部，但在容器末端停止
【发布时间】：2020-07-06 08:08:47
【问题描述】：

我正在开发一个静态站点，该站点在某些页面上具有侧导航，并且导航旨在在滚动时粘在屏幕底部。如何让导航停止粘在父容器的底部？导航应该留在父级内。

现在，即使在容器不在视野范围内并最终与页脚重叠后，它仍会继续粘贴。

这里是演示站点：

【问题讨论】：

【解决方案1】：

您的元素具有“fixed-bottom”属性作为其类之一。这会将导航元素的 y-axis 位置附加到屏幕底部，而不是父容器的底部。

您可以做几件事来清理它。如果您只是希望它不重叠，您可以在元素底部添加填充；我发现用 100px 填充它的效果很好，如下图所示。

您还可以使用“relative”标签将其附加到实际的父容器上，该解决方案在本网站的其他各种帖子中进行了讨论： Fixed position but relative to container

【讨论】：