html - CSS float doesn't keep outer block element sized properly -


मेरे पास निम्न HTML कोड है:

  & lt; ul class = "blogEntry" & gt ; & Lt; li वर्ग = "शीर्षक अनुभाग" & gt; & Lt; span & gt; & lt; एएसपी: लिमिटल आईडी = "लिटटाइटल" रनैट = "सर्वर" /> gt; & lt; / span & gt; & Lt; span class = "date" & gt; एएसपी: लिटारल आईडी = "लिट डेट" रनैट = "सर्वर" टेक्स्ट = "10/1/1000" /> gt; & lt; / span & gt; & Lt; / li & gt; & Lt; li वर्ग = "शरीर खंड" & gt; & lt; एएसपी: लिबरल आईडी = "litBody" runat = "server" /> & lt; / li & gt; & Lt; li वर्ग = "टैग खंड" & gt; & Lt; ul class = "tags" & gt; & Lt; li वर्ग = "टैग" & gt; टैग 1 & lt; / li & gt; & Lt; li वर्ग = "टैग" & gt; टैग 2 & lt; / li & gt; & Lt; li वर्ग = "टैग" & gt; टैग 3 & lt; / li & gt; & Lt; / ul & gt; & Lt; / li & gt; & Lt; / ul & gt;  

और निम्न सीएसएस कोड:

  ul.blogEntry {सीमा: 1px ठोस काले; सीमा नीचे: 0 पिक्सेल; पैडिंग: 0 पिक्सेल; } Ul.blogEntry li.section, ul.blogEntry li.lastsection {list-style: none; } Ul.blogEntry li.title {पृष्ठभूमि रंग: # 67A7FF; फ़ॉन्ट-आकार: 14px; फोंट की मोटाई: बोल्ड; } Ul.blogEntry li.title अवधि {प्रदर्शन: इनलाइन; } Ul.blogEntry li.title.section span.date {float: right; } Ul.blogEntry li.section {padding: 4px; सीमा नीचे: 1px ठोस काले; }  

जैसा कि, दिनांक एक नई रेखा पर आ जाएगी और दाएं से फ़्लोट करें अगर मैं ul.blogEntry li.title span सीएसएस बदलता है और फ्लोट जोड़ता हूं: बाएं; बाहरी लाइट तत्व की ऊंचाई कम हो जाती है और नीचे की सीमा में स्पैन 'टेक्स्ट के माध्यम से कट जाता है सलाह?

कृपया समाशोधन के लिए कोई भी तत्व जोड़ना न करें। तत्व जो कि केवल विशिष्ट स्टाइल को सक्षम करते हैं, शब्दों और चिंताओं को अलग करने में महत्वपूर्ण रूप से शब्दों को तोड़ते हैं और अलग होते हैं।

सरल जवाब को अतिप्रवाह: ऑटो; को कंटेनर तत्व (यानी li.title) अन्य तरीकों से:

  • समाशोधन ब्लाइग बीवीआईएल हैं।


    Comments

    Popular posts from this blog

    c# - ListView onScroll event -

    PHP - get image from byte array -

    Linux Terminal Problem with Non-Canonical Terminal I/O app -