미디어 쿼리의 CSS가 적용되지 않습니다.

편집 : 해결했습니다. 나는 우연히 삭제하려는 CSS의 중간에 미디어 쿼리를 남겼습니다. 또한 일부 오류가 수정되었습니다. 고마워요. 공장.미디어 쿼리의 CSS가 적용되지 않습니다.

그래서 잘 작동하는 HTML 및 CSS 코드가 많습니다. 그런 다음 CSS에 2 개의 미디어 쿼리를 추가합니다. 각 쿼리에서 다른 CSS의 일부를 재정의 할 코드를 약간 추가합니다. 이 미디어 쿼리 코드는 작동하지 않습니다. 여기 내 미디어 쿼리 물건입니다 :

@media screen and (max-width: 975px){ 
    body .top_outermost_container { 
     width: 976px; 
    } 
} 
@media screen and (max-height: 485px){ 
    .bottom_bar { 
     top: 445px; 
     bottom: auto; 
    } 
} 
*/

필자가 여기에 전체 코드를 넣어 : 좀 쳐위한 http://codepen.io/anon/pen/CJgqI 감사합니다! 너 락이야. 진짜를 위해서. 그런데 브라우저의 렌더링 품질을 높이려면 코드를 복사하여 텍스트 편집기에 붙여 넣어야 할 수도 있습니다. 감사 인사

출처

2013-10-16 macsplean

'최대 높이'를 의미합니까? –

방화범이 끌리는 것을 사용하는 것은 어떤 스타일이 어디에 적용되는지를 볼 수 있기 때문에 이런 종류의 일에 좋은 생각입니다. 오버 라이드 작동 여부와 관련하여 스타일 타겟팅이 얼마나 구체적인지와 관련이있을 수 있습니다. –

마크 업에는'div's가 닫히지 않고, 몇 가지 누락 된'>'등의 오류가 있습니다. – Xareyo

그 후행 */은 문제 일 수 있습니다.

구문이 정상적으로 작동하므로 제대로 작동합니다.

출처

2013-10-16 11:34:46 Halcyon

당신이 말하고있는 문제는 처음 @media 쿼리를 닫지 않는 것 같습니다. @media screen and (max-width: 975px) and (max-height: 438px){에는 "}"이 필요합니다. 두 번째 쿼리는 다른 쿼리의 하위 쿼리가 될 수 없기 때문에 실행되지 않습니다. 따라서 228 번 또는 그 이후에는 @media screen and (max-width: 975px){ 쿼리 바로 앞에 닫는 "}"이 필요합니다. 하지만 다른 문제가 있습니다.

귀하의 오류가 fromt 오는 것 같다 그는 HTML이 유효성 검사 도구 등 http://html5.validator.nu/

사용 ">"

Line 15: <div class= "top_contained_container" </div> 
Line 39: <div class="bottom_list_container1" </div> 
Line 49: <div class="bottom_list2" </div>

태그를 닫아야 할 위치 당신은 또한에 몇 가지 오류가 당신이 쉽게 찾을 수 있습니다 추가 닫기 태그처럼 CSS "}"

Line 114: body {overflow: hidden;}}

뿐만 아니라 검증 도구를 통해 다음과 같습니다 http://jigsaw.w3.org/css-validator/validator

출처

2013-10-16 11:48:29 darcher

미디어 쿼리의 CSS가 적용되지 않습니다.

답변

관련 문제