垂直對齊div中的最後一個元素

Question

我想讓類type垂直對齊到底部，但是我一直在嘗試失敗。也許任何人都可以推薦我更好的方法？ 我不能讓箱子變小，因爲其餘的div都是相等的高度。

HTML：

<div class="medium_container"> 
    <div class="medium_item"> 
     <a href=""><img src="http://placehold.it/170x100"></a> 
     <div class="medium">111111111</div> 
     <div class="brand">22222222</div> 
     <div class="titles">333333333</div> 
     <div class="country">44444444<br />444444444</div> 
     <span class="type">55555555555</span> 
    </div> 
</div> 

CSS：

.medium_container {display:block;} 
.medium_item { 
display: inline-block; 
padding:7px; 
margin:10px 3px; 
width:170px; 
border:1px solid black; 
height:400px; 
} 
.medium_item img { 
width:170px; 
height:100px; 
} 
.type { 
vertical-align: bottom; 
display: table-cell; 
} 

jsfiddle

Answer 1

您可以絕對位置.type相對於它的父.medium_item如下

.medium_item { 
    position:relative; /*add this*/ 
    display: inline-block; 
    padding:7px; 
    margin:10px 3px; 
    width:170px; 
    border:1px solid black; 
    height:400px; 
} 
.type { 
    display: table-cell; 
    vertical-align: bottom; 
    position:absolute; /*add this*/ 
    bottom:0; /*add this*/ 
} 

Updated Fiddle