제가 사용하는 레이아웃의 경우 레이아웃 외 다른 자료들에서 input 입력창의 크기나 혹은 box 크기가 정상적이지 않은 경우가 발생합니다.

이유는 레이아웃에서 지정된 box-sizing 때문인데요.

이렇게 다른 자료의 박스가 세로가 유난히 작습니다. 

레이아웃에 

* {

box-sizing: border-box;

} 

위와 같이 모든 곳에 box-sizing: border-box; 가 적용되도록 지정되어 있어서 다른 모든 곳이 저것이 적용되어 버립니다.

각 자료별로 박스의 가로,세로 크기를 입력할때 저 기준이 아닌 것들이 있을 수 있는데 레이아웃에서 모든 요소에 적용되도록 해버리니 의도된 박스크기가 아닌 크기의 박스가 출력되어 버리는 것 입니다.

레이아웃의 box-sizing: border-box; 를 적용하고 싶은 곳을 개별적으로 지정해서 모든 요소에 지정되지 않도록 해야 하는데 이걸 다시 수정하기가 좀 어려워서 약간의 트릭으로 레이아웃과 관련이 적은 컨텐츠가 출력되는 부부분을 정확히 구분해서 해당 영역(div)에는 box-sizing: border-box; 가 예외가 되도록 처리해 주어 회피했습니다.

컨텐츠가 출력되는 곳에 저는 div를 임의로 추가해서 감싼 것이 있어서 거기에 class를 추가해주고 해당 class를 제외할 수 있도록 해봤습니다.

*:not(.content-area *) {
box-sizing: border-box;
}

위와 같이 해 주니 content-area 쪽에는 box-sizing: border-box; 가 적용되지 않아 다른 자료들이 원래 가졌던 기준 그대로 가로,세로폭이 출력이 되게 되었습니다.

게시판 설정, 회원가입 등등... 너무 많은 곳들의 box 사이즈가 원래대로 회복 되었습니다.