CSS

box-sizing

미짱~ 2023. 1. 23. 19:17

box-sizing 

box-sizing : 요소의 크기 계산 기준을 지정

  • content-box : 요소의 내용(content)으로 크기 계산 (기본값)
  • border-box 요소의 내용 + padding + border로 크기 계산  

코드펜 예제

See the Pen box-sizing by 김선미 (@tjsalsun) on CodePen.


TIL

key point

box-sizing 기본값은 content-box이다 

컨텐츠 포함해서 계산하기때문에 일일이 계산 하기보다는 border-box를 이용하기 
 
느낀점

box-sizing 사용은 유용해서 과제시나 프로젝트시 잘 사용할거 같다


오늘의 학습 만족도 
⭐⭐⭐⭐⭐