[오류해결] 반응형 웹 적용되지 않는 오류

미디어쿼리를 다음과 같이 작성했음에도 모바일 화면에 원하는 결과가 나오지 않는 오류 발생

@media screen and (min-width: 320px) and (max-width: 800px) {
 /*css코드*/
}

라는 오류가 발생하고 onclick이벤트가 동작하지 않는 오류 발생

html의 <head></head> 안에 다음 코드를 추가한다.

<meta name="viewport" content="width=device-width, initial-scale=1">

width=device-width: 화면의 넓이를 디바이스의 넓이로 지정
initial-scale=1: 초기 화면 배율

CSS 미디어 쿼리 디바이스별 해상도 분기점

기본적으로 반응형웹을 적용하기 위해서 먼저 HTML head 부분에 meta viewport를 설정해주어야 합니다. width=device-width: 화면의 넓이를 디바이스의 넓이로 지정 initial-scale=1: 초기 화면 배율 4개의 반응

hohoya33.tistory.com

노력중인 블로그