[CSS] About layout_inline, inline-block, block

CSS의 display 속성은 웹페이지상에서 요소들이 어떻게 보여지고,
다른 요소들과 어떻게 상호 배치되는지 결정한다.

display:inline

inline 속성은 전후 줄바꿈 없이 한 줄에 다른 엘리먼트들과 나란히 배치된다. width와 height를 명시 할 수 없다.

display:block

block은 한 영역을 차지 하는 박스형태을 가지는 성질이며, 자동 줄 바꿈이 된다.
기본적으로 width:100%이며, height와 width값을 지정할 수 있다.
block은 margin과 padding을 지정 할 수 있다.

display:inline-block

inline-block은 위의 inline과 block의 특성을 둘 다 가지고 있다. inline처럼 줄바꿈이 이루어지지 않으며, block처럼 width와 height를 지정 할 수 있다.
만약 width와 height를 지정하지 않을 경우, inline과 같이 컨텐츠만큼 영역이 잡힌다.