2016-09-17 3 views
1

내 앱이 화면을 채우도록 콘텐츠 높이를 수동으로 설정하고 싶습니다. 이이 작업을 수행하는 코드입니다 :왜 내 계산이 높이가 17px 떨어져 있습니까?

let headerHeight = $("#navBar").height(); 
let footerHeight = $("#footer").height(); 
let browserWindowHeight = $(window).height(); 
let contentHeight = browserWindowHeight - (headerHeight + footerHeight); 
$("#pageHost").height(contentHeight); 

그러나, 그것은 17 개 픽셀 너무 큰,하지만 그들은 어디에서 오는지 나는 찾을 수 없습니다.

크롬 개발자 도구를 신중하게 살펴 봤는데 모든 계산이 정확합니다. 내가 설정했습니다

경계 상자가 사용되고 있는지 확인하십시오.

하지만 총 17 개를 빼지 않으면 스크롤바가 계속 나타납니다.

어떻게 해결합니까?

답변

3

은 아마 기본 마진와 함께 bodyhtml 같은

html,body { 
    box-sizing: border-box; 
    margin: 0; padding: 0; 
} 
*, *:before, *:after { 
    box-sizing: inherit; 
} 

HTML 태그 (8px I가 틀리지 않는 경우 내가 HTML/신체 선택에 시도를 기억하지 않는 결합 된 여백/패딩입니다 수). 그들도 패딩이 있는지에 대해서는 잘 모르겠습니다. 제발, 이것이 당신이 찾고 있던 대답이라면, 정확한 숫자를 펼치십시오.

+0

네 말이 맞아요, 바닥 글의 내용에 여백을 찾았습니다. 현재 예상대로 작동 중입니다. –

+1

기꺼이 도와 드리겠습니다. @GregGum 게시물이 해결 된 경우 대답을 받아주세요 – FedeSc

+2

'padding : 0'을 삭제할 수 있습니다. – LGSon

관련 문제