如何用CSS将一个项目放在其容器的底部

200 阅读1分钟

了解如何使用CSS将一个项目粘在其容器的底部

这是一件相当常见的事情,我最近就不得不这么做了。

我盲目地给一个元素分配了bottom: 0 ,我想把它粘在它的父体的底部。

结果发现我忘记了两件事:在该元素上设置position: absolute ,并在父元素上添加position: relative

例子。

<div class="container-element">
  ...
  <div class="element-to-stick-to-bottom">
    ...
  </div>
</div>
.element-to-stick-to-bottom {
  position: absolute;
  bottom: 0;
}

.container-element {
  position: relative;
}