डिस्प्ले: ब्लॉक इनसाइड डिस्प्ले: इनलाइन

जबकि प्रश्न डिस्प्ले के परिदृश्य को प्रस्तुत करता है: डिस्प्ले के भीतर ब्लॉक तत्व: इनलाइन पैरेंट, मूल प्रश्न ऐसे परिदृश्य में इन दो प्रदर्शन मानों के बीच अंतर के बारे में है।

सीएसएस 2.1 विनिर्देश के अनुसार, जब एक इनलाइन तत्व में एक ब्लॉक तत्व होता है, तो इनलाइन बॉक्स ब्लॉक के चारों ओर टूट जाता है। ब्लॉक के पहले और बाद में इनलाइन सामग्री के आसपास अनाम ब्लॉक बॉक्स बनाए जाते हैं, और ब्लॉक इन अनाम बॉक्स का सहोदर बन जाता है।

इसके परिणामस्वरूप एक संरचना बनती है जहां मूल तत्व, भले ही इसे डिस्प्ले के रूप में परिभाषित किया गया हो: इनलाइन, डिस्प्ले:ब्लॉक चाइल्ड की उपस्थिति के कारण अलग व्यवहार करता है। मूल तत्व प्रभावी रूप से एक ब्लॉक बॉक्स बन जाता है जिसमें अनाम ब्लॉक बॉक्स होते हैं।

डिस्प्ले के बीच अंतर: इनलाइन और डिस्प्ले: ब्लॉक पैरेंट

संरचना में समानता के बावजूद, सूक्ष्म हैं इस परिदृश्य में डिस्प्ले:इनलाइन और डिस्प्ले:ब्लॉक पैरेंट तत्वों के बीच अंतर:

• सामग्री प्रवाह: इनलाइन तत्व पाठ के साथ क्षैतिज रूप से प्रवाहित होते हैं, जबकि ब्लॉक तत्व लंबवत रूप से प्रवाहित होते हैं। इनलाइन पैरेंट के चारों ओर बनाए गए अनाम ब्लॉक बॉक्स, ब्लॉक व्यवहार का अनुकरण करते हुए, चाइल्ड तत्वों की ऊर्ध्वाधर स्टैकिंग की अनुमति देते हैं। ब्लॉक चाइल्ड के समीप इनलाइन सामग्री। यह डिस्प्ले:ब्लॉक पैरेंट के मामले में नहीं है, जहां संपूर्ण पैरेंट तत्व एक ब्लॉक बॉक्स बन जाता है।
• बॉर्डर ट्रीटमेंट: सीएसएस 2.1 विनिर्देश नोट करता है कि कुछ गुण, जैसे बॉर्डर, अभी भी उन तत्वों पर लागू होता है जो अज्ञात ब्लॉक बॉक्स उत्पन्न करते हैं। इसलिए, बॉर्डर वाले डिस्प्ले: इनलाइन पेरेंट में अनाम ब्लॉक बॉक्स के चारों ओर बॉर्डर खींचा जाएगा, जिससे लाइन ब्रेक पर एक खुली बॉर्डर बनेगी। इसके विपरीत, एक डिस्प्ले: बॉर्डर वाले ब्लॉक पेरेंट में पूरे ब्लॉक बॉक्स के चारों ओर एक बंद बॉर्डर होगा।
• टेक्स्ट रैपिंग: इनलाइन तत्व स्वाभाविक रूप से टेक्स्ट को अपने चारों ओर लपेटते हैं। इस परिदृश्य में, इनलाइन सामग्री के आसपास के अनाम ब्लॉक बॉक्स टेक्स्ट को ब्लॉक चाइल्ड के चारों ओर लपेटने से रोकते हैं, जैसे कि पैरेंट एक डिस्प्ले:ब्लॉक तत्व था।