미디어 쿼리가 무시되는 이유는 무엇입니까?

Question

저는 처음에는 미디어 쿼리와 관련하여 몇 가지 오류를 발생시키는 CSS 유효성 검사기를 사용했습니다.이 오류를 수정 한 이후 (유효성 검사기로 다시 확인했습니다. 이번에는 0 오류를 다시 가져 왔음) 여전히 유효하지 않습니다. 내 브라우저에서 코드를 인식합니다. 크롬을 사용하고 있습니다.

/* MEDIA QUERIES ======================================================= MEDIA QUERIES */ 


@media screen and (max-width: 640px) { 

/* HEADER SLIDER */ 

#home-header .home-slider { 
    max-width: 100%; 
    margin: auto; 
} 

#home-header .metaslider { 
max-width: 90%; 
margin: auto; 
} 



/* USE IT ============================ USE IT */ 

    .circle { 
display: block; 
margin: 0 auto 30px; 
} 


#circle-3 { 
    margin-right: auto; 
} 

#use .logo { 
    display: none; 
} 

#use .buy-now { 
    float: none; 
    margin: 0 auto; 
} 

} 

Answer 1

기본 css 파일의 우선 순위가 미디어 쿼리보다 낮은지 확인해야합니다. 아마 미디어 쿼리의 # 홈 - 헤더 스타일이 무시되고있는 것일까?

예인 경우 선택기 앞에 예를 들어. body div이므로 body div#home-header .home-slider처럼 보일 것입니다. 선택자를보다 정확하게 지정하면 우선 순위가 높아집니다.