मैं अपने कंटेनर के नीचे एक छवि कैसे शुरू करूं?

Question

मेरे पास overflow: hidden; के साथ एक छोटे कंटेनर के अंदर एक लंबा छवि है। छवि के नीचे काट दिया गया है। मैं नीचे की जगह शीर्ष पर कटौती कैसे करूं?

Answer 1

कंटेनर निम्नलिखित सीएसएस दे:

position:relative; 

और छवि निम्नलिखित सीएसएस:

position:absolute; 
bottom:0px; 

पी.एस. btw

Answer 2

बहुत अच्छा (और स्पष्ट) चित्र तो अपनी छवि सिर्फ कंटेनर के background-image है, इस तरह से कार्य करें: अन्यथा

#container { 
    background: url(your-image.jpg) no-repeat bottom left; 
} 

, कंटेनर के नीचे करने के img तत्व की स्थिति, जैसे @Joseph सुझाव: कंटेनर उदाहरण के लिए एक 300px ऊंचाई है

#container { 
    position:relative; 
} 

#container img { 
    position: absolute; 
    bottom: 0px; 
} 

Answer 3

हैं, तो यह काम करता है:

चित्रण के लिए

.container { 
    overflow: hidden; 
    height: 300px; 
    position: relative; 
} 

.image { 
    position: absolute; 
    bottom: 0; 
}