CSS float속성

float

CSS 속성(property) float 은 한 요소(element)가 보통 흐름(normal flow)으로부터 빠져 텍스트 및 인라인(inline) 요소가 그 주위를 감싸는 자기 컨테이너의 좌우측을 따라 배치되어야 함을 지정합니다.

📄출처: MDN contributors.

float 프로퍼티는 해당 요소를 다음 요소 위에 떠 있게 한다.
여기서 떠 있다(float)는 의미는 요소가 기본 레이아웃 흐름에서 벗어나 요소의 모서리가 페이지의 왼쪽이나 오른쪽에 이동하는 것이다.
그래서 보통 레이아웃을 구성할 때 요소를 가로 정렬하기 위해 사용되는 기법이다.
예를 들어, 문서에 사진과 그림이 있을 때, 그림을 왼쪽이나 오른쪽으로 띄워서 정렬 하거나 각 객체를 오른쪽이나 왼쪽으로 정렬하여 전체 문서를 배치(layout)할 때도 사용할 수 있다.
flex박스를 사용하기전에는 float를 자주 사용했다

float 속성