chrome 개발자 도구의 Device mode 동작하지 않을 때
모바일 환경이 고려되지 않고 개발한 제품을 급하게 모바일 지원할 일이 생겼다. 개발과정에서 개발자 도구의 device mode를 활용하여 그때그때 확인하고 있었는데 기기를 선택해도 해당 기기와 배율이 맞지 않는 것처럼 느껴졌는데 역시나 적용이 안되고 있었다... Device Mode : 디바이스 모드는 모바일 뷰포트를 시뮬레이팅 해볼 수 있는 기능이다. 크롬 개발자도구를 켜면 좌측 상단 element 선택하는 아이콘 바로 옆에 위치하고 있다. Dimensions를 Responsive로 설정하면 자유롭게 뷰포트의 크기를 지정할 수 있고, 특정 기기를 선택한 경우 해당 디바이스에서 쓰는 뷰포트 사이즈로 고정되게 된다. 디바이스 선택후에도 뷰포트 사이즈에 따라 적용해둔 CSS가 적용되지 않는다면 아래 설정을 ..