Neden biz box-sizing: margin-box; yok mu? Genellikle bizim stil sayfaları box-sizing: border-box; koyduk biz gerçekten eski.

Örnek:

Hadi 2 sütun bir sayfa düzeni var. Her iki sütun P'si, ama oluk yok çünkü biraz çirkin görünüyor (ortasındaki boşluk); Aşağıda CSS genişliği:

.col2 {
    width: 50%;
    float: left;
}

Sadece 2 sütun ilk sağ kenar boşluğu ayarlama yapabiliriz düşünebilirsiniz oluk uygulamak için; şöyle bir şey:

.col2:first-child {
    margin-right: 24px;
}

Ama bu aşağıdakiler doğrudur çünkü yeni bir hat üzerine ikinci sütun kaydırma yapın:

50%   50%   24px > 100%

box-sizing: margin-box; elemanın hesaplanan genişlik marjı ekleyerek bu sorunu çözer. Bu bulmak istiyorumçokbox-sizing: border-box; daha yararlı daha faydalı.

Sen renkler senin için width: calc(50% - 24px); kullanamadı? Sonra kenar boşluklarını ayarlayın.