부트 스트랩 v2 : 미디어 쿼리 작동 방식을 이해할 수 없습니다.

Question

첫 번째 미디어 쿼리를 만들었습니다! custom.css 페이지에 다음 미디어 쿼리를 추가했습니다.

@media (max-width: 1200px) { 
footer { 
    background-color: red; 
    } 
} 

나는 미디어 쿼리가 작동하는 방식을 볼 수 있도록 바닥 글을 빨간색으로 만들었습니다. 브라우저를 최대 1200px까지 확장하면 바닥 글은 1183px에서 갈색으로 변하고, 1200px까지 빨간색으로 유지되도록 미디어 쿼리를 "말 했음"에도 불구하고 1200px에 도달하기 전입니다. 내가 1200px에 도달하기 전에 빨간색이 사라지는 이유는 무엇입니까?

실시간 미리보기 내 site is here의 실시간 미리보기.

편집 : 나는 실제 브레이크 포인트가 1200 픽셀이 아니라 1183px ... 그리고 바닥 글 최대 폭 작성 내 미디어 쿼리에도 불구하고 빨간색으로 변합니다 때입니다 것으로 나타났습니다 : .....

Answer 1

1200 픽셀 귀하 medai 쿼리는 나에게 잘 어울립니다.

덧글을 @Kevin Reid으로 선택하면 jQuery에는 창 너비 계산의 스크롤 막대가 포함됩니다. @media 쿼리를 사용하는 경우 웹 브라우저 (예 : Chrome 및 Safari)에는 스크롤 막대가 포함되지 않지만 Firefox는 미디어 쿼리 계산에서 스크롤 막대를 포함한다는 의견을 읽었습니다.

당신이주의해야 할 페이지를 하나의 세부 사항 예상대로 뭔가가 작동하지 않기 때문에 당신이 요구하는 경우는 부트 스트랩 CSS는

@media (min-width: 1200px){ 
... grid changes here ... 
} 

1200 픽셀 @ 레이아웃을 변경한다는 것입니다 귀하의 테스트

@media (max-width: 1200px) { 
footer { 
background-color: red; 
} 
} 

입니다

실제로 부트 스트랩 CSS와는 1px 씩 일치하지 않습니다. 당신은 @media 화면과`

@media (max-width: 1199px) { 
footer { 
background-color: red; 
} 
}