क्या मैं अतिप्रवाह का उपयोग कर सकता हूं: किसी भी तरह की स्पष्ट ऊंचाई के बिना छिपा हुआ?

Question

मेरे पास float:left के साथ एक छवि है, और मैं इसे अपने माता-पिता को बहाना चाहता हूं, लेकिन ओवरफ़्लो काट दूंगा। जो मैं चाहता

                                   

यहाँ है:: यहाँ क्या यह किसी भी overflow नियमों के बिना की तरह लग रहा है

For some reason यह निर्णय लिया गया कि overflow:hidden बिना तत्व बढ़ रही है में स्पष्ट ऊंचाई परिणाम:                                 

यहाँ एक बेला है।

क्या मैं किसी भी तरह से स्पष्ट ऊंचाई स्थापित किए बिना प्रभाव को प्राप्त कर सकता हूं? एक स्पष्ट ऊंचाई काम नहीं करती है क्योंकि मैं सामग्री की लंबाई और ब्राउज़र चौड़ाई के आधार पर यह div स्वचालित रूप से आकार देना चाहता हूं।

Answer 1

ओवरफ्लो का उपयोग करके मेरी राय में: आयामों को सेट किए बिना छुपाएं समझ में नहीं आता है। http://jsfiddle.net/ZA5Lm/11/

छवि पूर्ण साथ रखा जाता है, यह पाठ से बाहर ले जा रहा: आप अगर अपनी छवियों को एक निश्चित चौड़ाई आप इस समाधान का उपयोग कर सकता है कंटेनर की ऊंचाई निर्दिष्ट करने के लिए नहीं करना चाहते हैं बहे। हालांकि - और मुझे पता है कि यह बदसूरत हो सकता है - पाठ को छवि से दूर ले जाने के लिए आपको पैडिंग-बाएं निर्दिष्ट करने की आवश्यकता है।

Answer 2

मैंने सीएसएस-ट्रिक्स पर एक पोस्ट देखा और इसके बारे में बात की। पर यह बाहर की जाँच के लिए जाओ - http://css-tricks.com/minimum-paragraph-widths/

यह उपयोगी हो सकता है :) गुड लक

इसके अलावा सिर्फ अपने कोड को देखा और मैं नाव कहा: अपने div करने के लिए सही है, तो यह इस तरह दिखता है -

div { 
border: 1px solid black; 
padding: 10px; 
float: right 
/*overflow: hidden;*/ 
} 

सुनिश्चित नहीं है कि आप यही चाहते हैं?

Answer 3

यह थोड़ा मुश्किल (मैं रिश्तेदार + पूर्ण स्थिति और पाठ की स्थिति के लिए एक विशिष्ट गद्दी का उपयोग), लेकिन यह करता है प्रभाव आप मार्कअप बदलने या height की स्थापना के बिना पूछा:

body { 
    padding: 10px; 
} 
img { 
    float: left; 
    position: absolute; 
    left : 10px; 
} 
div { 
    border: 1px solid black; 
    padding: 10px 10px 10px 280px; 
    position : relative; 
    overflow: hidden; 
} 

मैं सिर्फ डाला शैली (यहां तक ​​कि यदि float:left अब आवश्यक नहीं होगा)