float & clear

이진성·2022년 9월 1일
0

css

목록 보기
1/6

float

문서의 일반적인 흐름에서 제외되어 자신을 포함하고 있는 컨테이너의 왼쪽이나 오른쪽에 배치되게 한다.

속성값의미
none기본값, 원래 상태
left자신을 포함하고 있는 박스의 왼편에 떠 있어야 함
right자신을 포함하고 있는 박스의 오른편에 떠있어야 함

⇒ 문서의 흐름에선 제외되지만, 필요한 만큼의 공간은 차지한다.

clear

clear속성은 float 요소 이후에 표시되는 요소가 float을 해제(clear)하여 float 요소의 아래로 내려가게 할 수 있다.

속성값의미
none기본값, 아래로 이동되지 않음을 나타내는 키워드
leftfloat이 left인 요소의 아래로 내려가겠다.
rightfloat이 right인 요소의 아래로 내려가겠다.
bothfloat이 left 및 right인 요소의 아래로 내려가겠다.

⇒ clear: both; 를 사용하면 한번에 해결 가능!!

profile
좋은 소스 코드를 연구하는 개발자

0개의 댓글