코딩을 완료 후, 크롬에서는 아무 이상이 없었던 background의 이미지가 익스플로러에서 흐릿하게 뭉개지는 현상이 있었습니다.

css를 잘못 입력했나 이것저것 입력해봤는데 소용이 없더라구요.

구글링해보니 저와 같은 문제를 겪은 분이 계셨고, 그 분이 남기신 url로 들어가보니 왜 이런 문제가 생기는 지 알 수 있었는데요.

제 경우는 이미지보다 작은 엘리먼트에 해당 이미지를 background-image로 설정해서 발생한 버그였었습니다.

다행히도 이미지를 엘리먼트에 맞게 크롭하니 익스플로러에서도 이미지가 제대로 나오는 것을 확인할 수 있었구요.

(position을 center로 두는 것도 버그에 포함될 수도 있다고 하는데 이 부분은 참고로 알아두면 좋을 것 같습니다.)

이미지를 통째로 background로 넣기보다 이미지에 텍스트나 따로 뺄 수 있는 이미지 레이어가 있다면 분리해서 

background로 넣을 때 분리해서 넣는 것이 좋을 것 같다는 생각이 들었습니다.

... 꼭 크롬에서는 괜찮다고 여기면 늘 익스플로러에서 말썽이니;;

저만 번거롭게 느껴지는 걸까요. 크로스브라우징 체크는 기본이라고는 하지만

뭔가 손이 두번 세번 더 가는 기분이 들고 여간 번거로운게 아니네요.

++ 근래에 같은 버그가 또 생겨서 이유를 살펴보니 Element에 width 값을 주지 않아서 이미지가 흐릿하게 보이더라구요. 

위 방법으로 안될 시에는 width값을 주는 것도 방법이 될 것 같습니다.

* 참고 사이트 

- http://www.i-swear.com/956

- http://connect.microsoft.com/IE/feedback/details/810354/ie11-css-background-image-show-blur