float 태그 정렬

float에 대한 정의는 아래 사진과 같다.

간단하게 태그를 정렬하는 기능이다.

 

그 동안은 text-align 혹은 position absolute/ right:0 이런 식으로 사용했어서..

이번에 css 작업하다가 처음으로 알게 된 기능이다.

 

맨 오른쪽으로나 아래로 붙일때 주로 absolute를 사용했는데, 이미지 작업이나 (반응형)복잡한 퍼블리싱 작업에서는 

확실히 문제가 생겼다. 뭐든 간단하게 짜는게 좋은 것인데... 

css는 봐도봐도봐도 새로운게 나온다 ㅠㅠ 계속 공부하자..

 

& clear 속성도 함께 사용할 수 있다.

clear:both 속성을 부여하여 부모가 자식의 높이를 인식하도록 하는 방법.

:after 형식으로 가상엘리먼트를 만들어서 사용하는게 좋습니다. 참고.