CSS box model

< Properties >

width & height

: 컨텐츠 가로세로 설정

 

box-sizing: border-box; -> 테두리가 원래 설정한 컨텐츠 크기 안에 포함됨.

 

*short handed property

border: 두께, 스타일, 색상 순서;

Padding

: element와 border사이 공간 

Margin

: element 테두리 간 간격

Display property options

*87강 참고

Inline

width&height are ignored. margin & padding push elements away horizontally but not vertically

Block

Width&Height, Margin&Padding are respected.

Inline-block

behave like an inline element except Width&Height. Margin&Padding are respected.