jQuery的對齊內底部的div

Question

的位置絕對是不可能的。 vertical-align：bottom; display：table-cell;會工作，但它需要居中。

我需要裏面的div圖像對齊到底部。圖像高度不同。

我應該針對每個圖像和計算容器高度，並使用滯留者爲上邊距或有更簡單的解決方案？

謝謝！

Answer 1

您可以設置「行高」和「文本對齊」的div屬性，然後設置DIV中的圖像的「垂直對齊」屬性。

即

div.images 
{ 
    width: 720px; 
    display: block; 
    text-align: center; 
    line-height: 720px; 
} 
div.images img 
{ 
    vertical-align: bottom; 
} 

Answer 2

你不必相對於整個頁面的絕對位置。您只需打開容器的定位相對：

$("#my_id").parent().position(position : "relative"); 

，然後內

$("#my_id").position(position : "absolute", left : ______, top : ______) 

或CSS絕對定位的元素，

#my_container { 
    position: relative; 
} 

#my_id { 
    position: absolute; 
    left: __; 
    top: __; 
} 

Answer 3

您可以將圖像添加爲背景和使用bottom center定位：

div { 
    background: url("path_to_img") no-repeat bottom center; 
    width: 500px; 
    height: 500px; 
    background-color: #e1e1e1; 
} 

Answer 4

你並不需要爲這個jQuery：

<div id="wrap"> 
    <img src="img/image.jpg" alt="" /> 
</div> 

#wrap { position: relative; } 
#wrap img { 
    position: absolute; /* display: block is implied */ 
    bottom: 0; 
}