<div> 기본적으로 활용하는 속성 정리

clear 속성 

  1. clear 속성을 적용하지 않을 때.

사진은 float:left 상태, clear를 설정하지 않으면 글자가 아래처럼 둘러싼 형태가 됩니다.

 

2. float:left, clear:left 설정했을 때.

3. float:right, clear:right 설정했을 때.

4. clear:both 설정했을 때.

 

 

float 속성

  float는 뜨다라는 의미이며, element에 부유 속성을 줘 배치할 수 있게 하는 기능을 가지고 있다. 그리고 주의 할 점은 float으로 컨텐츠를 띄웠을 시 다음 내용은 빈자리를 채우려 들어오기 때문에 배치가 이상하게 되는 현상이 있다. 이 해결 방법은 clearfix나 clear속성을 이용하면 된다.

참고 : http://www.beautifulcss.com/archives/787

 

clearfix 속성

https://youtaekjung.github.io/2018/04/21/css/CSS-float-clearfix/