html - Set div's height to occupy the contents layout -

मैं निम्न प्राप्त करना चाहता हूं:

1. "मुख्य" div और साइडबार "div" सामग्री के अनुसार न्यूनतम ऊँचाई (शायद ब्राउज़र की स्क्रीन ऊँचाई या 700px) की अधिकतम ऊंचाई सीमित नहीं है।
2. "सामग्री" div उन्हें लपेट करनी चाहिए (दोनों की समान ऊंचाई और चौड़ाई) उन्हें)

मार्कअप:

  & lt; html xmlns = "http://www.w3.org/1999/xhtml" & gt; & Lt; head runat = "server" & gt; & Lt; title & gt; & lt; / title & gt; & Lt; link href = "StyleSheet2.css" rel = "स्टाइलशीट" प्रकार = "टेक्स्ट / सीएसएस" / & gt; & Lt; / head & gt; & LT; बॉडी & gt; & Lt; div id = "लपेटें" & gt; & Lt; div id = "content" & gt; & Lt; div id = "मुख्य" & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; p & gt; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx & lt; / p & gt; & Lt; / div & gt; & Lt; div id = "साइडबार" & gt; & lt; / div & gt; & Lt; / div & gt; & Lt; div id = "footer" & gt; & Lt; p & gt; पाद & lt; / p & gt; & Lt; / div & gt; & Lt; / div & gt; & Lt; / body & gt; & Lt; / html & gt;  

सीएसएस:

  शरीर, html {मार्जिन: 0; पैडिंग: 5 पीएक्स; रंग: # 000; पृष्ठभूमि: # एसी 187; ऊंचाई: 100%; } # वेपर {चौड़ाई: 752 पीएक्स; ऊंचाई: 100%; मार्जिन: 0 ऑटो; } # सामग्री {सीमा: 1 पीएक्स ठोस # 000000; ऊंचाई: 100%; पृष्ठभूमि रंग: # dbeef8; } # मेन {फ्लोट: बाएं; चौड़ाई: 506 पीएक्स; पैडिंग: 10px; सीमा: पतला धराशायी हरा; ऊंचाई: 100%; } # साइडबार {सीमा: पतली धराशायी # एफएफ 0000; सही नाव; चौड़ाई: 200px; पैडिंग: 10px; ऊंचाई: 100%; } #footer {स्पष्ट: दोनों; पैडिंग: 5px 10px; पृष्ठभूमि: # सीसी 9; }  

ध्यान दें: एक "रैप" डिवि है और इसकी भी आवश्यकता है क्योंकि यह एक शीर्षलेख को लपेटता है जिसे मैं छोड़ा था।

शुद्ध सीएसएस के साथ समान ऊंचाई कॉलम जब मैंने पूछा कि आपने इसके लिए पूछा तो मैंने एक न्यूनतम ऊंचाई जोड़ा। आईई 6 न्यूनतम ऊंचाई को समझ नहीं पा रहा है, लेकिन न्यूनतम ऊंचाई के रूप में ऊंचाई मानते हुए आईई 6 को विशुद्ध रूप से न्यूनतम ऊंचाई के लिए है। यह इस के एक धारीदार संस्करण है ..

  # container2 {स्पष्ट: बाएं; बाईंओर तैरना; चौड़ाई: 100%; छिपा हुआ सैलाब; पृष्ठभूमि: # एफएफए 7 ए 7;} # कंटेनर 1 {फ्लोट: बाएं; चौड़ाई: 100%; स्थिति: रिश्तेदार; सही: 50%; पृष्ठभूमि: # fff689; / * स्तंभ 1 पृष्ठभूमि का रंग * /} # col1 {फ्लोट: बायां; चौड़ाई: 46%; स्थिति: रिश्तेदार; बाएं: 52%; छिपा हुआ सैलाब; _height: 700px; मिनट-height: 700px; } # Col2 {फ्लोट: बाएं; चौड़ाई: 46%; स्थिति: रिश्तेदार; बाएं: 56%; छिपा हुआ सैलाब; _height: 700px; मिनट-height: 700px; } & Lt; div id = "container2" & gt; & Lt; div id = "container1" & gt; & Lt; div id = "col1" & gt; & Lt; p & gt; कुछ पाठ & lt; / p & gt; & Lt; / div & gt; & Lt; div id = "col2" & gt; & Lt; p & gt; कुछ पाठ & lt; / p & gt; & Lt; / div & gt; & Lt; / div & gt;