웹, 웹 반응형에서는 정상인데 모바일에서 이미지가 회전되어 보이는 이슈

css 로 background 로 이미지를 보여주는데, 웹페이지에서는 정상적으로 보이고

페이지 가로를 줄여도 이미지 사이즈만 줄었을 뿐 제대로된 방향으로 나왔다.

웹을 배포 한 후 모바일(폰)으로 테스트했을 때 이미지방향이 변경되었다.

 

실제로 이미지를 열어보았을 때도 이미지 방향은 제대로 나왔다.

내 예상으로 EXIF 이미지 회전값의 문제인 것 같았다. 

우선 이미지를 포토샵에서 확인해보니, 모바일에서 보였던 것과 같이 회전되어서 보여졌다. 

모바일에서 보인 이미지가 진짜 회전값이었다.

 

포토샵으로 방향을 변경한 후 저장하고 다시 배포하여 모바일로 테스트하니 

이미지가 제대로된 방향으로 나왔다. 

 

이미지가 웹, pc 와 모바일에서 다른방향으로 보일 경우 exif 값을 확인해보거나, 포토샵으로 이미지를 열어보면 확인 가능할 것 같다.