답변 2
1
Mel 님께서 말씀하신 '패딩은 총 80 , 보더는 총 40' 은 너비와 높이를 합한 값 입니다.
너비와 높이를 합산한 값을 고려할 일은 없습니다.
너비 따로 높이 따로 생각하시면 이해가 편하실거에요.
너비 패딩은 좌우해서 총 40, 너비 보더는 좌우해서 총 20
높이 패딩은 위아래해서 총 40, 높이 보더는 위아래해서 총 20
0
박스모델(width 300px, height:100px)안에 박스(width100px height100px) 3개를 넣을때 box-sizing:border-box는 margin에는 영향을 안주는 것 같은데 혹시 박스3개 짜리에 margin을 1px씩 넣고 싶으면 큰 박스모델은 width306px; height102px로 계산해서 해야하나요?
박스사이징은 패딩과 보더 포함 여부를 결정하지 사진은 제어하지 못합니다. 이런 경우 마진이 필요한 경우 display: flex 주시고 gap: 10px 이렇게 하시면 수월합니다.