CSS位置absolutue對齊div的底部與父

http://tinypic.com/r/9km2v8/5 CSS位置absolutue對齊div的底部與父

在圖像中，您會看到浮動框。框的左上角（0,0）與父div的頂部對齊，即第3行。

我試圖讓浮動框的左下角與中間的對齊母公司

我使用CSS：

.video_desc_box_open { 
position: absolute; 
left: 500px; 
width: 301px; 
}

底部：0;不起作用。它將頁面推下很遠。

我也接受JS解決方案:)

謝謝！編輯：差不多忘了，高度是動態的。

HTML：

<div class="video_odd"> 
<div class="video_list_viewed" > 
<img src="viewed_no_odd.jpg" /> 
</div> 
<div class="video_list_number"> 
3 
</div> 
<div class="video_list_title"> 
<a id="show-panel" class="show-panel" href="#">Title to vid</a> 
</div> 
<div class="video_list_desc"> 
Text goes here 
</div> 
<div class="video_desc_box"> 
<img src="desc_box_top.png" /> 
<div class="video_desc_box_text"> 
Text for the desc goes here 
Run Time:1:21 
<br> 
Desc goes here 
</div> 
<img src="desc_box_bottom.png" /> 
</div> 
<div class="video_list_post_date"> 
02/01/2011 
</div> 
<div class="video_list_run_time"> 
1:21 
</div> 
</div>

來源

2012-03-26 joshmmo

我想我有點明白你的問題，試試這個：

#parent_div { 

position:relative 

} 

.video_desc_box_open { 
    position: absolute; 
    top:-50% 
    left: 500px; 
    width: 301px; 

}

如果你能提供生動的代碼會更容易，使用底來幫助:)

來源

2012-03-26 22:42:14 Paradise

爲其添加了HTML – joshmmo 2012-03-26 22:58:43

該HTML僅用於一個div行。我正在使用JS設置顯示沒有隱藏/顯示您看到的彈出框。我只是需要它與div的中間對齊。 – joshmmo 2012-03-26 22:59:50

你的建議沒有太多的工作。它會移動它，但它仍然沒有與div對齊（是的，我從50改變了％，並測試了不同的東西） – joshmmo 2012-03-26 23:00:44

添加position:relative;到盒子的父然後對齊使用bottom。

來源

2012-03-26 22:37:31

對齊：0？ – joshmmo 2012-03-26 23:01:11

CSS位置absolutue對齊div的底部與父

回答

相關問題