使用下面的clearfix類，問題迎刃而解了。

.clearfix::before,.clearfix::after{content: '';display: table;clear: both;}

這是兩種問題的綜合解決方案：

1. 高度坍塌（引入.box類即可）

.box::after{content: '';clear: both;display: block;}

2. 垂直外邊距重疊

.box::before{content: '';display: table;}

總結

以上是生活随笔為你收集整理的CSS外边距重叠和高度坍塌完美解决的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。