안녕하세요 셀럽워드프레스입니다.
오늘은 익스플로러로 웹 서핑시 레이아웃이 깨지게 되는 “호환성 오류” 해결방법에 대해 알려드릴까 합니다.
익스플로러로 웹사이트를 서핑하다보면 종종 페이지 레이아웃이 깨지는 현상을 보실 수 있습니다. 워드프레스 웹사이트도 마찬가지죠..
그 이유는 익스플로러 8 이상 버전부터 생긴 바로 “호환성 모드” 라는 녀석 때문인데요.
호환성 모드는 익스플로러에서 F12 버튼을 눌렀을때 확인 할 수 있습니다.
- 브라우저 모드: 현재 브라우저의 기본 세팅
- 문서 모드: 컨텐츠를 렌더링 하는 방식
바로 이 문서모드가 웹사이트의 환경에 맞지 않은 버전을 랜더링값으로 잡고 있을 때 오류가 발생하게 됩니다.
때문에 문서모드를 최신버전(또는 웹사이트 환경에 맞는 브라우저)으로 지정해줘야 익스플로러 깨짐현상이 해결된답니다.
해결방법은 다음과 같습니다.
header.php 에서 <head></head> 태그 안에 아래의 <meta>를 넣어주면 됩니다.
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"/>
(※ 가장 최신 Internet Explorer 버전을 표준모드로 지정해줍니다. 크롬 사용자는 크롬프레임을 랜더링 해줍니다.)
이 태그를 넣어주면 익스플로러에서 꺠짐현상없이 다른 브라우저와 동일한 화면으로 서핑하실 수 있답니다.
적용방법은 매우 간단하지만,<meta> 태그 유무에 따라 웹사이트의 흥망성쇠를 좌우할 수 있으니, 알아두시는걸 권장드립니다. :^)
＊별첨
태그 세부 설정
<meta http-equiv="X-UA-Compatible" content="IE=7"> <meta http-equiv="X-UA-Compatible" content="IE=8"> <meta http-equiv="X-UA-Compatible" content="IE=9"> <meta http-equiv="X-UA-Compatible" content="IE=10">