CSS - inline, block, inline-block

inline, block

 

block : 한 줄을 다 차지하는 box

• margin : box의 border(경계)의 바깥에 있는 공간
• padding: box의 border(경계)의 안쪽에 있는 공간

 

inline : 한 줄에 여러 요소가 올 수 있음. 높이/너비 존재하지 않음.

• margin은 좌/우만 가질 수 있음
• padding은 상하좌우 다 가질 수 있음.

 

inline-block : flex와 유사하게 block 요소들이 inline 성질을 가짐.
그러나 정해진 형식이 없으며 반응형 디자인을 지원하지않는다.