Çocuk dikey kenar boşlukları neden ana kabı genişletmiyor?

Question

Bir ana kapsayıcıyı genişletmek için bir çocuğun kenar boşluğuna ihtiyacım olan bir davaya rastladım. Ebeveyn dışında kalan alanın ayrıldığını, ancak üst öğenin kendisinin genişletilmediğini buldum. Daha sonra ebeveyne 'overflow: hidden' ekleyerek bu sorunu düzeltebileceğimi buldum.

Neden böyle olduğuna dair herhangi bir ışık tutabilir mi?

GÜNCELLEME: Ben ebeveyne herhangi dolgu veya sınır değerini ekleyerek de bu giderdiği bulduk

.

Updated Example

Answer 1

cevap. Bir "block formatting context" kurabilen belirli özellikler vardır. Yani:

Şamandıralar kesinlikle [sabit] 'taşma yerleştirilmiş elemanlar, blok kaplar (örneğin içi bloklar, masa-hücreleri ve masa-başlıklar) kutuları bloke edilir ve blok çerçeveleri 'görünür' dışında '( , bu değer görünümüne yayıldığında hariç), içerikleri için yeni blok formatlama bağlamları oluşturur.

O nasıl margin (ve bir gelmesi durumunda elemanları aşağıdakilerden float, padding önceki) için yapılan yorumlar çalışmalarında yukarıda verildiği gibi böyle çözümler faaliyet nedeni olan blok biçimleme bağlamında bu değişimdir .

Answer 2

Ben marjları çöken nedeni olduğunu düşünüyorum: "neden" iyi ve özlü here açıklanmıştır için http://www.w3.org/TR/CSS2/box.html#collapsing-margins