Web/CSS
CSS - div, float 연습
bugtype
2019. 3. 19. 12:29
<div style="background: #ededed">
hello
<div style="background: #444">
world
</div>
<div style="float:left; background: #666">
1
</div>
<div style="background: #888; width: 100px;">
2
</div>
<div style="background: #aaa">
3
</div>
</div>
hello
world
1
2
3
첫번째 div에서 BFC(block format context)이 생성 되어집니다. block은 자동으로 height값이 자기 부모 영역만큼 커집니다. ( hello )
float: left 옵션을 주면 block 영역이 현재 div 내에 있는 텍스트만큼만 영역이 잡힙니다.