Float 이란?
float의 '띄우다'라는 뜻에서 유추할 수 있듯, float는 요소가 container안에서 띄워져서 정렬될 수 있도록 하는 CSS 속성이다.
보통 문서에 사진이나 그림이 있을때 자주 이용한다. float를 이용하면 주변 요소들이 사진이나 그림을 둘러쌀 수 있다.
하지만 사진 뿐만이 아니라 그 어떤 inline 요소들을 둘러싸기 위해서도 사용할 수 있다.
Float values
float의 값에는 none|left|right|inherit등이 있다.
1. float: none;
이는 디폴트 값이다.
아래의 사진에서 볼 수 있듯이, 디폴트 값은 이미지의 inline을 고려해서 주변에 공간을 만든다.
2. float: left | right;
요소가 container안에서 왼쪽이나 오른쪽에 정렬될 수 있다.
아래의 사진에서 회색 박스를 텍스트가 둘러싸고 있는 것을 볼 수 있다.
3. float: inherit;
부모 요소의 값을 상속받을 수 있다.
