IE, FF, Chrome 에서 렌더링이 다른 이유 알아보기.

웹페이지를 개발하고 있다. 

그런데 동일한 소스코드임에도 FF, IE, Chrome 가 렌더링하는 모양이 모두 다르다. 

어떤 느낌이냐면 IE랑 Chrome 이 대충 알아서 잘 그려준다면, FF는 내가 설정한 대로 정확하게 그려 주는 느낌...

분명히 동일한 코드 임에도 FF 에서만 다르게 그려주기 때문에 크로스브라우서 설정을 위해서 모두 깔아두고 테스트 할 수 밖에 없다. 거기다 IE8, IE9 의 동작 차이도 있기 때문에 지금 컴퓨터에 깔려 있는 브라우저만 Chrome, FF, IE8, IE9 4개 이다. 

그래서 도데체 왜 이렇게 다르게 그려주는 것인가를 한번 알아보기로 했다. 

참조 페이지 링크

Ethanjoh 님 블로그 => http://ethanjoh.tistory.com/196

브라우저 렌더링 엔진 위키 => http://en.wikipedia.org/wiki/Web_browser_engine

크롬은 WebKit 엔진, FF는 Gecko 엔진, IE는 Trident 엔진, Opera는 Presto 을 사용한다. 

회사 별로 렌더링을 구현한 엔진이 다르다 보니, 동일한 코드에도 다른 화면을 보여주는 것이다. 

오류를 없애려면 되도록 표준에 맞춰서 구현하는 것이 좋고, 각 브라우저별로 동작 여부를 확인해보아야 하겠다.