css 子元素设置浮动父元素高度没有解决办法

现在布局很少用到float了，基本都是用的flex布局，之前一直都是用的设置父元素高度，其实这样不太行，最近看到一个关于这个的问题，就整理一下

1.父元素设置overflow: hidden;

2.父元素设置float: left/right;width: 100%;后面的元素加clear:both;

3.在子元素的最后加一个空元素: clear: both;

4.父元素的尾元素::after设置clear: both;

    .header::after {
     content: "";  
     clear: both;
     /* display: table; */ 
     display: block;
     height: 0;
    }