لسبب ما هامش انهيار قواعد أدخلت في CSS؟

Question

وفقط لا يمكن معرفة الوضع عند هذا مجموعة ذكية من القواعد يمكن أن تكون مفيدة. كسروا بساطة نموذج الصندوق وتوفير مصدر لانهائي من مشاكل عند الجمع بين القطع المختلفة من تخطيط معا. فما هو السبب؟

قوانين للمرجع.

تحديث: قواعد منطقية تماما عن الأخوة العناصر، ولكن لماذا يجب أن هوامش نشر عناصر الأم يصل إلى الشجرة؟ أي نوع من المشاكل التي تحل؟

وعلى سبيل المثال:

<div style="margin: 20px; background-color: red;">
    <div style="margin: 20px;">
        <p style="margin: 100px;">red</p>
    </div>
</div>
<div style="margin: 20px; background-color: blue;">blue</div>

متباعدة

وعناصر div مستوى أعلى من بعضها البعض من خلال 100px.

Answer 1

وهذه هي واحدة من الحالات التي لا تجعل حقا معنى حتى كنت أدرك أن البدائل تجعل من المنطق.

وكما تعلمون، وهوامش تحدد المسافة بين العناصر، انها ليست "الحشو الخارجي" الذي يحيط كل عنصر. إذا عنصرين مع 20px الهامش هي بجانب بعضها البعض، والمسافة بينهما 20px، 40px لا.

وأما الهامش هو المسافة إلى عنصر آخر، فمن المنطقي أن المسافة هي من العنصر إلى العناصر المحيطة، وليس إلى حدود العنصر الأم.

إذا أن تحسب الهامش إلى حدود العنصر الأم، ووضع العناصر في عنصر div سيقدم تباعد إضافي بين عناصر إفنثوو div نفسها لديها أي هامش أو حشوة. يجب على هوامش حول عنصر لا تزال هي نفسها إذا قمت بإضافة div unstyled حوله.

Answer 2

عند يمكن أن يكون مفيدا؟

وأبسط مثال: قائمة الفقرات والعناوين، مع كل margin-top وmargin-bottom. كنت ترغب في الهامش على الجزء العلوي والسفلي من هذه المادة، وبين العناصر المختلفة.

ومع هامش تنهار، يمكنك أن تفعل دون تحديد هوامش خاصة على البند الأول أو الأخير (NOT جزء من المواصفات CSS الأصلي!) أو حشوة الحاوية.

ولكن أنا أتفق، على العموم، انها سمة من سمات طائل.

Answer 3

والنظر في جسد النص يحتوي على عدة فقرات. تريد كل فقرة لتكون مفصولة 2em، وتريد الفقرة الأولى على فصلها عن محتوى السابقة التي 2em، والفقرة الأخيرة لفصلها عن محتوى التالية 2em.

ويتم تحقيق ذلك بسهولة مع CSS التالية، لأن الهوامش العلوية والسفلية التي تفصل بين الفقرات ستنهار:

p {
    margin-top: 2em
    margin-bottom: 2em;
}

إذا لم هوامش تنهار، وهذا من شأنه أن يؤدي على هامش يجري مفصولة بمسافة من 4em، وليس 2em. دون هامش ينهار، فإن الطريقة الوحيدة لتحقيق التأثير المطلوب أن يكون لاقامة بعض قواعد إضافية لالفقرتين الأولى والأخيرة، التي من شأنها أن تنطوي على منحهم فئة أو معرف (والذي يجب أن يتم الحفاظ إذا كان النص تغيير أي وقت مضى) ، أو التفاف لهم في عنصر اضافي على خلاف ذلك، لا داعي لها واستخدام: أولا الطفل و: الماضي والطفل، أو ... حسنا، يمكنك الحصول على فكرة

واستطيع ان اؤكد أنه إذا هامش الانهيار لم يحدث، SO سيكون له الكثير من الأسئلة المكررة يسأل عن الحلول لتحقيق تباعد ثابت أن توفر القاعدة المذكورة أعلاه: -)