float 층에 띄우기!
float: left;
float 층에 띄우고 아래에는 인라인이 올수 없기 때문에 글이 옆으로 흐른다.
float 층으로 떠버리면 기본흐름(normal floor) 층의 나머지는 크기에 맞춰 조정된다.
크기에 맞추기위해 다시한번 랜더 트리를 그리도록 한다. ( BFC 재계산을 일으키는 여러가지 방식 )
overflow: hidden;
그러면 이미 떠있는 float을 확인하고 랜더 트리를 그린다.
or ::after 를 활용하여 다시 그리도록 한다.
or 또다른 요소에 clear를 줘서 BFC 재계산을 일어나게 한다.
이미 float에 떠있는 것을 overflow:hidden 으로 BFC 재계산을 했다면 ::after를 사용할 필요 없다.
float 을 주면 block 성질로 바뀐다.
position: absolute;
: 절대 독립적인 배치가 이루어지는 층에 옮겨진다.
position: relative;
: 분신을 float 층에 자리를 차지하도록 둔 후 절대 독립적인 배치가 이루어지는 층에 존재하도록 한다.
( 움직이는 기준은 분신이 차지한 자리를 기준으로 움직인다. )