العرض: كتلة العرض الداخلي: مضمنة

بينما يطرح السؤال سيناريو العرض: عنصر الكتلة داخل العرض: الأصل المضمن، السؤال الأساسي هو حول الاختلافات بين قيمتي العرض هاتين في مثل هذا السيناريو.

وفقًا لمواصفات CSS 2.1، عندما يحتوي عنصر مضمن على عنصر كتلة، يتم تقسيم المربع المضمن حول الكتلة. يتم إنشاء مربعات الكتل المجهولة حول المحتوى المضمن قبل وبعد الكتلة، وتصبح الكتلة شقيقًا لهذه المربعات المجهولة.

ينتج عن هذا بنية يكون فيها العنصر الأصلي، على الرغم من تعريفه على أنه عرض: مضمن، يتصرف بشكل مختلف بسبب وجود العرض: كتلة الطفل. يصبح العنصر الأصلي بشكل فعال مربع كتلة يحتوي على مربعات كتلة مجهولة.

الاختلافات بين العرض: المضمنة والعرض: كتلة الأصل

على الرغم من التشابه في البنية، هناك بعض الفروق الدقيقة الاختلافات بين العرض: المضمن والعرض: حظر العناصر الأصلية في هذا السيناريو:

• تدفق المحتوى: تتدفق العناصر المضمنة أفقيًا مع النص، بينما تتدفق عناصر الحظر عموديًا. تسمح مربعات الكتل المجهولة التي تم إنشاؤها حول الأصل المضمن بالتكديس العمودي للعناصر الفرعية، ومحاكاة سلوك الكتلة.
إنشاء مربع كتلة مجهول:
• يؤدي العرض: مضمن إلى إنشاء مربعات كتلة مجهولة لـ المحتوى المضمن المجاور للكتلة الفرعية. ليس هذا هو الحال مع العرض: كتلة الأصل، حيث يصبح العنصر الأصلي بأكمله مربع كتلة.
معالجة الحدود:
• تشير مواصفات CSS 2.1 إلى أن بعض الخصائص، مثل الحدود، لا يزال ينطبق على العناصر التي تولد مربعات كتلة مجهولة. ولذلك، فإن العرض: الأصل المضمّن ذو الحدود سيكون له حدود مرسومة حول مربعات الكتل المجهولة، مما يؤدي إلى إنشاء حد مفتوح عند فواصل الأسطر. في المقابل، فإن العرض: الكتلة الأصلية ذات الحدود سيكون لها حدود مغلقة حول مربع الكتلة بأكمله.
التفاف النص:
• تقوم العناصر المضمنة بلف النص حولها بشكل طبيعي. في هذا السيناريو، تمنع مربعات الحظر المجهولة المحيطة بالمحتوى المضمن النص من الالتفاف حول الكتلة الفرعية، كما لو كان الأصل عبارة عن عنصر عرض:كتلة.