CSS에서 box-sizing: border-box를 적용하면 어떤 변화가 생기나요?
쉬움 MDN Web Docs해설
box-sizing: border-box를 적용하면 요소의 width, height에 padding과 border 두께가 포함됩니다. 기본값인 content-box에서는 padding과 border가 width에 추가되어 실제 크기가 더 커지지만, border-box는 지정한 크기 내에서 계산되어 레이아웃 관리가 편합니다.
box-sizing: border-box를 적용하면 요소의 width, height에 padding과 border 두께가 포함됩니다. 기본값인 content-box에서는 padding과 border가 width에 추가되어 실제 크기가 더 커지지만, border-box는 지정한 크기 내에서 계산되어 레이아웃 관리가 편합니다.