html - 需要在 div 的最底部显示图像

Question

我希望图像显示在 div 的最底部，div 没有设置高度，因为它会根据 content-body div 中的内容量而变化

<a href="http://facebook.com/page" id="find-us-on-facebook">facebook</a>

这是带有背景图像的链接的 css

#featured-left a#find-us-on-facebook:link,
#featured-left a#find-us-on-facebook:visited {
 display: block;
 width: 183px;
 height: 52px;
 text-decoration: none;
 background: url('/images/uploads/images/find-us-on-facebook.png') no-repeat;
 overflow: hidden;
 text-indent: -10000px;
 font-size: 0px;
 line-height: 0px;
}

#featured-left a#find-us-on-facebook:hover {
 background-position: 0 -52px;
 overflow: hidden;
 text-indent: -10000px;
 font-size: 0px;
 line-height: 0px;
}

Answer 1

将 padding-bottom: 52px 添加到您的 facebook 按钮所在的内容 div，等于按钮的高度 (52px)(如果容器底部已经有一些填充将其添加到 52px 或添加更多以在按钮和内容之间创建间隙)并将内容 div 的位置属性设置为 position: relative。

然后将你的 facebook 按钮位置设置为 position: absolute 并将其定位为 bottom: 0 以及任何 left 或 right 你觉得合适。

然后还有一个更文明的解决方案 - 只需将它放在内容 div 中的内容的最底部。虽然我假设既然你问这个你就不能那样做。