如何從底部到頂部垂直堆疊div元素？

Question

我想堆疊2 div彼此之上（即從下到上）。 底部有一個動態高度，我希望頂部div相應地堆疊在它上面。

我想讓他們從bottom: 0起。不是從底部到底

Answer 1

<div> s是塊級元素。它們默認垂直堆疊。

Answer 2

使用Flexbox CSS屬性是以您想要的方式更改元素排序的唯一方法（元素的源順序與所需的顯示順序相反，元素具有動態尺寸）如果您正在尋找純CSS解決方案。

如果一個元素有一個固定大小（如圖像，不建議使用文本元素），你可以使用絕對定位：

http://jsfiddle.net/wHDWP/

.container { 
    position: relative; 
} 

.top { 
    border: 1px solid red; 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    height: 1.5em; 
} 

.bottom { 
    border: 1px solid blue; 
    padding-bottom: 1.5em; 
} 

你能重新使用JS如果要素你絕望了。