使子元素填充100％的父母的最小高度設置爲100％

Question

我有一個應用程序使用粘性頁腳，但是，我有一個約束，需要一個內容容器跨越其父母的100％有一個最小高度：100％定義。在這個簡化的示例中，inner是內容容器，並且換頁是父級。最小高度：粘性頁腳需要100％才能正常運行。

<div class="page-wrap"> 
    <div class=inner> 
    <h1>.inner</h1> 
    <button id="add">Add Content</button> 
    </div> 
</div> 

<footer class="site-footer"> 
    <h1>.site-footer</h1> 
</footer> 

請看小提琴的例子。

http://codepen.io/TroutZen/pen/OywGWg

Answer 1

可以嘗試使用這樣的：

.inner { 
    width: 100%; 
    background-color: green; 
    top: 0; 
    bottom: 142px; 
    position: absolute; 
} 

Example