css - How to make a floated div 100% height of its parent? -
यहां HTML है:
& lt; div id = "outer" & gt; & Lt; div id = "इनर" & gt; & lt; / div & gt; टेस्ट & lt; / div & gt;
और यहां सीएसएस है:
#inner {float: left; ऊंचाई: 100%; }
क्रोम डेवलपर उपकरण के साथ निरीक्षण पर, आंतरिक डिविजन 0 पीएक्स की ऊंचाई प्राप्त कर रहा है।
मैं इसे कैसे 100% माता-पिता div?
इसके कंटेंट के आधार पर #outer
ऊंचाई के लिए और उसके पास #inner
इसके ऊँचाई का आधार है, दोनों तत्वों को पूरी तरह से तैनात करते हैं।
अधिक विवरणों के लिए युक्ति में पाया जा सकता है, लेकिन अनिवार्य रूप से, #inner
#outer
की ऊंचाई स्वतः
की ऊंचाई को अनदेखा करनी चाहिए #outer
बिल्कुल स्थित है तब #inner
ऊंचाई 0 होगी, जब तक #inner
ही बिल्कुल स्थित नहीं है।
& lt; style & gt ; #outer {स्थिति: पूर्ण; ऊंचाई: ऑटो; चौड़ाई: 200px; सीमा: 1px ठोस लाल; } #inner {स्थिति: निरपेक्ष; ऊंचाई: 100%; चौड़ाई: 20px; सीमा: 1px ठोस काला; } & Lt; / style & gt; & Lt; div id = 'outer' & gt; & Lt; div id = 'इनर' & gt; & Lt; / div & gt; पाठ & lt; / div & gt;
हालांकि ... #inner
स्थिति में, एक float
सेटिंग को नजरअंदाज कर दिया जाएगा, इसलिए आपको चौड़ाई चुननी होगी स्पष्ट रूप से, और #outer
में पेडिंग को नकली बनाने के लिए पाठ लपेटने के लिए मुझे संदेह है कि आप चाहते हैं। उदाहरण के लिए, नीचे, #outer
का पेडिंग #inner
+3 की चौड़ाई है सुविधा (पूरे बिंदु के रूप में #iner
ऊंचाई से 100% प्राप्त करना था) #inner
के नीचे पाठ को लपेटने की कोई आवश्यकता नहीं है, इसलिए यह # जैसा दिखाई देगा आंतरिक
जारी है।
& lt; शैली & gt; # बाहरी 2 {पैडिंग-बाएं: 23px; स्थिति: पूर्ण; ऊंचाई: ऑटो; चौड़ाई: 200px; सीमा: 1px ठोस लाल; } # इनर 2 {बाएं: 0; स्थिति: पूर्ण; ऊंचाई: 100%; चौड़ाई: 20px; सीमा: 1px ठोस काला; } & Lt; / style & gt; & Lt; div id = 'outer2' & gt; & Lt; div id = 'inner2' & gt; & Lt; / div & gt; पाठ & lt; / div & gt;
मैंने अपने पिछले उत्तर को हटा दिया, क्योंकि यह आपके लक्ष्य के बारे में बहुत गलत मान्यताओं पर आधारित था।
Comments
Post a Comment