[CSS] 클리어픽스(clearfix)

클리어픽스(clearfix)란 float으로 인하여 아래와 같이 영역이 깨져버리는 현상이 발생한다면... 즉 height 값이 사라져 영역이 깨진다면... overflow: hidden;을 사용하여 영역을 잡을 수 있지만 불안정. 이때, float을 사용한 상위(부모)박스에 .clearfix를 설정하면 float 으로 인하여 영역이 깨지는 현상을 방지하게 된다. 결국 .clearfix는 영역을 잡아주기 위한 css 속성. 클리어픽스의 사용방법은 다음과 같다. /* CSS */ .clearfix:before, .clearfix:after { display: block; content: ''; line-height: 0; } .clearfix:after { clear:both; } .clearfix { *z..

2021.03.02