※ 박스의 크기를 계산하는 방식을 정의할 수 있다.
※ 박스의 크기에 padding 과 border가 포함되므로 계산이 쉬워짐
margin은 포함 안되니 영향받는 범위내에서는 margin 대신 부모의 padding를 사용해 조절하면 편하다.
* {
box-sizing : border-box;
margin: 0;
}
| 값 | 내용 |
|---|---|
| content-box | 컨텐츠영역을 기준으로 크기를 정한다. (border,padding 미포함) width = content (no border, no padding) |
| border-box | 테두리를 기준으로 크기를 정한다. border,padding를 포함하고, margin은 포함하지 않는다. width = content + padding + border |
| initial | 기본값 |
| inherit | 부모요소 속성값을 상속 |