[css] box-sizing 요소의 크기를 제어하는 속성

css	값	의미
box-sizing:	content-box	제어할 요소의 너비와 높이를, 순수한 콘텐츠의 크기로 지정
	border-box	제어할 요소의 너비와 높이를, 콘텐츠와 padding, border 값을 더한 크기로 지정

div {
   width: 240px;
   height: 80px;
}

지정 너비/높이: 240/80
실제 너비/높이: 240/80

div {
   width: 240px;
   height: 80px;
   padding: 10px;
}

지정 너비/높이: 240/80
실제 너비/높이: 260/100

div {
   width: 240px;
   height: 80px;
   padding: 10px;
   border: 10px solid #F5dF4D;
}

지정 너비/높이: 240/80
실제 너비/높이: 280/120

div {
   width: 240px;
   height: 80px;
   padding: 10px;
   border: 10px solid #F5dF4D;
   box-sizing: border-box;
}

지정 너비/높이: 240/80
실제 너비/높이: 240/80