Float
float = 뜨다.
CSS 레이아웃 정리에 활용되는 속성입니다. flaot 값으로는 left, right, none, inherit을 부여 가능하며, 기본적으로 left나 right 값을 부여함으로써 왼쪽이나 오른쪽에 자리를 위치하게 하고 텍스트가 감쌀수 있게 합니다.
float: none 의 케이스
img는 inline 이며 위 사진은 p태그 안에 img 태그와 텍스트가 있는 케이스입니다. float이 기본값인 none 인 상태라 첫 텍스트줄이 이미지의 마지막 부분에 맞춰서 시작을 합니다. 이런 기본적인 상태에서는 보기가 깔끔하지 않는데요.
위에서 float right을 사용하면?
img(float:right)이 오른쪽에 위치하며 텍스트가 p태그 블록내 빈 자리인 왼쪽으로 자리하게 됩니다.
하지만 float의 경우 여러곳에 부여하다보면 겹치기도 하고 그걸 방지하기위해 clear 이나 overflow: hidden 등을 사용하여 부가적인 정리를 해줘야합니다.
