TIL_1

허정원·2021년 2월 15일
0

TIL

목록 보기
9/15
post-thumbnail

2021. 02. 15 월요일

기다리던 위코드 첫 날, 한시간 지각을 했다.
...
더 열심히 해야겠다.


💡 오늘의 꿀 팁!

box-sizing

width 값을 설정하고 해당 엘리먼트에 padding 과 border 값을 주면 실제 출력되는 width는 모든 값을 더해서 나온다.
원하는 width 값을 얻으려면 해당 엘리먼트의 width 와 padding, border 를 계산해야하는데
굉장히 귀찮고 복잡하다.
그래서 직관적인 width 를 표현하기 위해 box-sizing 속성을 이용한다.

* {
box-sizing: border-box;
}

div {
width: 300px;
padding: 50px;
}

이렇게 사용하면 div 태그의 width는 300에 맞춰져있고 그 안에서 padding 값이 사용자가 보기에도 직관적이고 편하다.

0개의 댓글