साफ़फिक्स बनाम ओवरफ्लो

Question

इसका मानक फ्लोट मुद्दा है। आपके पास एक मूल कंटेनर div के अंदर फ़्लोटिंग तत्वों का एक गुच्छा है। चूंकि बच्चे तैर रहे हैं, इसलिए माता-पिता सभी को शामिल करने के लिए विस्तार नहीं करते हैं।

मुझे स्पष्टफिक्स समाधान के बारे में पता है और माता-पिता कंटेनर div पर "ऑटो" या "छुपा" पर ओवरफ्लो प्रॉपर्टी सेट करना है। http://www.quirksmode.org/css/clearing.html मुझे ओवरफ्लो विधि सेट करने के लिए इसकी केवल एक संपत्ति के रूप में बहुत अच्छा लगता है। मैं समझना चाहता हूं कि इस विधि पर स्पष्टता दृष्टिकोण का लाभ कब होता है क्योंकि मुझे लगता है कि इसे अक्सर इस्तेमाल किया जा रहा है।

पीएस मैं आईई 6 के बारे में चिंतित नहीं हूं।

Answer 1

एकमात्र बार आपको "स्पष्टफिक्स" विधि का उपयोग करने से परेशान होना चाहिए जो स्पष्ट करने के लिए अदृश्य सामग्री को सम्मिलित करता है, यदि आपको उस तत्व को ओवरफ़्लो करने के लिए तत्व की आवश्यकता होती है जिसे आप इसे लागू कर रहे हैं, अन्यथा ट्रिगरिंग है Layout + overflow सुनहरा है ।

ध्यान दें कि आईई 7 ओवरफ्लो छुपा ट्रिगर्स में हैआउट। आईई 8 के बारे में निश्चित नहीं है।

#wrapper { width:80em; overflow:hidden; } 

विधि ऊपर सबसे सभी मामलों में ठीक काम करेगा जब तक कि आप अतीत #wrapper से ऊपर जाने का #header कहते हैं, की जरूरत है ..

#wrapper { width:80em; position:relative; } 
#wrapper:after { content:"."; clear:both; display:block; height:0; visibility:hidden; } 
#header { position:absolute; top:-15px; left:-15px; }