[CSS] float 속성 초기화

결론

부모 태그::after {
content:"";
dispaly:block;
clear:both;
}

본문

이 방법은 부모 태그가 float 사용 시 자식 태그의 높이를 인식하지 못할때 사용하는 방법이다.

회색 배경이 하위 요소들을 담아야 되는데 위 사진처럼 자식 요소들을 담아내지 못하고 있다.

이는 자식 요소들이 float:left를 사용했기에 그러지만
부모 요소의 float 속성을 초기화 시켜서 자식 요소의 높이를 인식 시켜야 된다.

부모 태그::after {
content:"";
dispaly:block;
clear:both;
}

위 코드를 입력하면 아래와 같이 변한다.