ul li圖像填補div

Question

我有一個2列的頁面。第一列是寬度爲30%，第二列爲70%，帶有幻燈片放映的縮略圖。這裏是第二列：

我想縮略圖填滿屏幕，你可以在部分留出了底部。

這是我

<div class="wrapper"> 
<ul class="rig"> 
    <li>Image 1</li> 
    <li>Image 2</li> 
    <li>Image 3</li> 
    <li>Image 4</li> 
    <li>Image 5</li> 
    <li>Image 6</li> 
    <li>Image 7</li> 
    <li>Image 8</li> 
    <li>Image 9</li> 
</ul> 
</div> 

.wrapper { 
    max-height: inherit; 
    max-width: inherit; 
} 

.rig { 
    max-width: 100%; 
    margin: 0 auto; 
    padding: 0; 
    font-size: 0; 
    list-style: none; 
    max-height: 100%; 
    } 

.rig li { 
    display: inline-block; 
    width:33.33%; 
    vertical-align:middle; 
    box-sizing:border-box; 
    margin:0; 
    padding:0; 
} 

我想是的縮略圖來填充屏幕沒有紅色部分。 有沒有辦法指定li元素的高度？ 基本上，我想寬度爲33.33%和其父容器的高度爲33.33%。我不想在像素中指定它...

Answer 1

問題已解決。謝謝您的幫助 。使用height: calc(100vh/3);