alt text http://img190.imageshack.us/img190/7514/unbenanntax.jpgकैसे एक div
का सही नीचे कोने में एक img जगह यह मुझे क्या करना चाहते हैं। इसमें कुछ पाठ के साथ एक div और दाएं कोने पर एक आईएमजी कोने। Div की ऊंचाई 24px पर स्थिर है लेकिन लंबाई ज्ञात नहीं है और इस divs में से एक से अधिक पंक्ति में हो सकता है।
ऐसा करने की कुछ तकनीकें हैं। सरल:
<div class="outer">
<img src="....">
</div>
div.outer { position: relative; height: 24px; }
div.outer img { position: absolute; right: 0; bottom: 0; }
अब जब कि सामान्य प्रवाह है, जो एक समस्या यह है कि आप अन्य उसके चारों ओर लपेट/नाव करने के लिए सामग्री चाहते है से बाहर ले जाता है। उस स्थिति में आपको वास्तव में छवि की ऊंचाई जानने की आवश्यकता है और फिर आपको जो मिला है उसके आधार पर उचित चाल लागू करें।
Making the absolute, relative के साथ शुरू करें।
यदि छवि 10 पिक्सल उच्च उदाहरण के लिए, है, तो आप इस कोशिश कर सकते:
div.outer { height: 24px; }
div.outer { float: right; margin-top: 14px; }
बेशक 14px 24px से आता है - 10px। मुझे नहीं पता कि क्या वह आपको संतुष्ट करने की कोशिश कर रहा है या नहीं।
तो defenetly thx - पहले कोड के बारे में - बस नीचे: 0 सही स्थिति के साथ 0 – bresleveloper
मैं क्लेटस से जवाब पर टिप्पणी नहीं कर सकता, लेकिन मुझे "px" को "दाएं: 0; नीचे: 0;" में जोड़ना पड़ा; तो यह है: दाएं: 0 पीएक्स; नीचे: 0 पीएक्स; मेरे मामले में यदि मैंने 'px' प्रत्यय के बिना' 0' के कुछ अलग रखा है तो यह काम नहीं करता है। – Jxadro
पृष्ठभूमि छवि आपका समाधान है।
<div class="blarg" style="background:url(image.gif) bottom right no-repeat">Content</div>
आप div की paddings, भी समायोजित करने के लिए है, तो div की सामग्री, अपनी तस्वीर ओवरलैप नहीं करता है तो यह आवश्यक हो पड़ सकता है।
यदि आप छवि के चारों ओर पाठ को फ़्लोट करना चाहते हैं, तो दोनों जवाब गलत हैं। दोनों छवि को छवि पर सही बना देंगे। मैं घंटों की तलाश में हूं और कोई असली जवाब मौजूद नहीं है। This article अधिक स्पष्ट रूप से बताता है कि यदि आप पाठ को लपेटने का प्रयास करते हैं तो उन दोनों उत्तरों का काम क्यों नहीं होगा।
+1 पेंट छवि के लिए +1! –
आप 'पृष्ठभूमि-छवि' भी आज़मा सकते हैं। – Gumbo
संबंधित: [डीआईवी के सभी चार कोने पर छवियां संलग्न करें] (http://stackoverflow.com/questions/17306087/attach-images-on-all-four-corner-of-div) और [कोने छवि जोड़ने के लिए स्मार्ट तरीका सभी चार कोनों पर डीवीवी सीमा तक] (http://stackoverflow.com/questions/6467063/smart-way-to-add-corner-image-to-div-border-on-all-four-corners)। –