2013-03-12 111 views
0

我有一個網站,我正在努力,並試圖讓圖像溢出在頂部,並在底部對齊。頂部的圖像溢出?

http://mytempsite.net/raven/

眼下DIV是500PX高,當圖像比這更大的它的溢出在底部隱藏。問題是它使圖像看起來很奇怪。我需要它的圖像伸展,因爲我正在使網站響應,我知道的圖像變得模糊,但這些只是臨時圖像。

我的問題是,有沒有辦法讓圖像的底部對齊,並像固定在DIV的底部,然後當它被拉伸得更大時,它會像頁面頂部一樣溢出?

回答

0

我想你試圖讓圖片的底部顯示而不是頂部?如果是這種情況,請在選擇器#myGallery img上將圖像的位置更改爲底部而不是頂部。

#myGallery img { 
    display:none; 
    position:absolute; 
    bottom: 0; // change this from top to bottom 
    width: 100%; 
    left:0; 
} 
+0

奏效,不知道爲什麼沒有來我的腦海裏。 DUH! – 2013-03-12 20:49:02

0

我建議從你的DIV移除高度,移除位置:從您的圖片絕對的,因爲你需要的圖像的高度來定義DIV,事無大小的高度。

在響應幻燈片,我已經開始做下面的CSS:

.slide { 
    width: 100%; 
    float: left; 
    margin-right: -100%; 
} 

這使您可以堆疊在一起彼此,就像絕對定位的做法,但在DIV迴應幻燈片的高度。

你也有白色褪色的底部,不過,我想這是你的問題,你想對較小的觀點,即褪色工作的部分原因。

爲此,img#fadeimage應該有position: absolute; bottom: 0; height: 100%,但您也可能需要構建圖像,以便頂部有更多的空白空間。

+0

我不想因爲褪色的外觀爲白色是一個獨立的圖像來獲取的樣子DIV向圖像的高度響應。這會導致問題。 – 2013-03-12 21:49:53