如何将div放在另一个div的底部？

Question

如何放置adInfoBox1在容器的底部？

看看这个:http://jsfiddle.net/snowman/hxXJh/

请注意,容器的高度不固定.

Answer 1

你可以用position: absolute.

.container
{
    height: 400px;
    position: relative;
}

.adInfoBox1 {
  padding: 5px 5px 5px 10px;
  position: absolute;
  bottom: 0px;
  width: 457px;
  background-color: green;
}

.adRegularList .categoryList {
  bottom: 0;
  height: 16px;
  position: absolute;
}

在这里查看一个工作示例:http://jsfiddle.net/hxXJh/5/

Answer 2

我建议：

.adInfoBox1 {
    padding: 5px 5px 5px 10px;
    position: absolute;
    bottom: 0; /* attaches the element to the bottom */
    left: 0; /* attaches the element to the left-side */
    right: 0; /* attaches the element to the right-side */
    background-color : green;
}

以上将.adInfoBox隐含地给出100% 的宽度。这可以通过删除或修改right或left声明来调整。我删除了float因为 usingposition: absolute;无论如何都会将元素从文档流中删除。

JS小提琴演示。